17

How could you get faster at visual design?

over 9 years ago from , Digital Designer

My job involves a mix of UX, interaction and visual design and a bit of front end development. I'm one of two designers in my officer and lead the UI design there. Most of my work involves sketching, wireframes, user flows, brainstorming, branding, prototyping, visual designs and sometimes writing a bit of HTML & CSS.

I started out working with digital agencies so I'm used to working quick under tight deadlines and I'm definitely not slow at what I do although my visual designs definitely slow me down the most. I spend too much time thinking about colours, typography and spacing, even though the layout has been clearly defined in the wireframes it still happens regularly.

I remember reading that Zurb get their designers to start with 6-8 quick designs within 3 hours. I know this is just a quick-and-dirty way of getting the ball rolling but I'd struggled to get that done in at least a day.

I'd be interested to hear if anyone else has or had the same problem or even has ideas on how to work past this and speed up the process.

11 comments

  • Milosz FalinskiMilosz Falinski, over 9 years ago (edited over 9 years ago )

    For me, switching from Photoshop to Sketch made a difference in speed.

    That said, I don't actually think being slow is a problem. In the end you don't need an X amount of designs, you just need to get to the right one. Good design is really difficult and takes time, it always will. Whether you go about it by making as many attempts as possible, or focusing on perfecting one attempt you feel strongly about should be a personal preference.

    I've also found that wireframes are a bit of a misleading stage, especially if they move beyond quick sketches and become a thing of their own. They make an awful lot of very important decisions, some of which can't be made without creating a full-on mockup. We sometimes do full wireframes, but only if it's something we think can benefit the client.

    For me a good process for web work starts with extremely careful evaluation of requirements and priorities, and before moving on from paper is a mixture of optimising user journeys and quick wireframe sketches. Only then I jump in to Sketch and usually find the 'right' (or 'good enough', if you're the self-hating type) solution within 2-3 attempts.

    8 points
  • Christopher CarterChristopher Carter, over 9 years ago

    Work on your visual thinking, I save a lot of time by fleshing out as many details I can in my brain before going to the computer. You'd be surprised how much time is wasted being trying to do focused thinking with the internet in front of us.

    7 points
  • Coulter PattonCoulter Patton, over 9 years ago (edited over 9 years ago )

    It sounds to me like you mostly have a problem committing to design decisions. I might recommend some of the following tactics:

    • First and foremost, remember that there is never one single solution. There are multiple solutions to every design problem and eventually you just need to pick one that works and go with it. There's no "platonic ideal" solution.

    • Work to a timer. Use something like the Pomodoro method to give yourself tight deadlines and commit to having a solution when the time is up.

    • Weed out the worst solutions first. If you're drowning in color or type choices, go back and remind yourself of the fundamentals. What choices flat out don't fit the design problem? Strike those options right now. Keep distilling your choices until you only have a few options left.

    • Give yourself constraints before you start. Sometimes it helps to give yourself constraints before you even begin the design process. Just because the brief doesn't specify a particular constraint, doesn't mean you can't make one up. Aim for two fonts total, or work with a limited color palette.

    • Work offline. I'm a firm believer in starting every project offline. The actual design solution is pretty much done before I even touch a computer. 90% of my effort goes into looking at the design problem(s) and sketching solutions with a good old fashioned pencil and paper. By the time I sit down and open Photoshop/Illustrator, I'm basically just building the solution I've already worked out by hand. The tough work is already done.

    Anyhow, those are a few tips that work for me.

    3 points
  • Adrian HowardAdrian Howard, over 9 years ago

    The three places where I've seen people speed up a lot are:

    1) When they move from producing designs from scratch to having a set of standard style guides and pattern libraries. Suddenly they're not spending time creating "standard" design elements by hand again and again (and again... and again...)

    2) When the spend more time at lo-fi levels of detail. When folk are using Sketch/PS/Illustrator/whatever they tend to explore and refine one design option at a time. Make a mistake or a wrong choice you have to backtrack, start again, and waste a lot of time. Exploring the design options with a couple of dozen sketches might feel slower - but you discover options and mistakes early and so waste less time when moving to higher fidelity artefacts,

    3) Stop working by yourself. Work with others. Get their opinions and feedback. Do pair designing. One person will spot the issue that the other misses. One person will unblock when the other gets blocked.

    Combining all three can be super productive. Get five or six people together. Do a generative lo-fi exercise like design studio method (https://vimeo.com/37861987) will get dozens of different design options explored and critiqued in a few hours. With a standard style guide and pattern library the most interesting options can be quickly thrown together from standard components. Leaving the rest of the time to focus on details than can delight.

    In short - don't try and work through the perfect design. Instead generate lots and lots of 'em, refining and discarding the ones that don't work.

    1 point
  • Emelyn BakerEmelyn Baker, over 9 years ago

    I work primarily in Illustrator, which makes rapidly generating layouts a piece of cake. Here's how my process goes:

    • Sketch as many layouts — as quickly as possible — within a 10 minute timeframe. Get the bad ideas out of your head and onto paper.
    • Start iterating in Illustrator. I can build out a few possible layouts fairly quickly by limiting the typeface, type sizes, and working without color.
    • Once I've got a few promising leads, I focus on one and start styling. I tend to work fairly methodically by tackling one element at a time: links, then headlines, then illustrations, then paragraphs... you get my drift.

    And when done, consult with stakeholders, iterate again, consult with stakeholders...

    1 point
  • Joris RigerlJoris Rigerl, over 9 years ago
    • Practice.
    • Build an organized library of resources.
    • Sketch on paper.
    • Lay the groundwork first and then iterate.
    • Practice.
    • Think before you start.
    • Set deadlines.
    • Define goals.
    • Practice.
    • Use tools that fit you.
    • Get feedback early.
    • Don't get distracted.
    • Practice.
    0 points
  • Bryan KulbaBryan Kulba, over 9 years ago

    This is such a great thread!

    I've been trying to speed up process lately so I've been thinking about this a lot.

    Working broadly to frame out ideas without getting fixated by little details is probably the most important way to efficiency. I feel like I'm the most successful (and fastest) when I've framed everything out and then focus on small design flourishes.

    The other thing I do is keep a list to keep focus. If I jot what I need to do down, then I can focus on solving problems one at a time instead of working on the footer a bit, then getting distracted by a heading...

    Someone also mentioned using libraries, which is another great thing to do. I also use templates to get started on stuff like branding, style tiles and moodboards. Starting with a blank page in Illustrator is sometimes too much of an opportunity for distraction. With templates for common deliverables or documents, I can systematically design bits and plunk them into a document and then move on.

    Again, great thread. I'm really enjoying reading everyone else's tips!

    0 points
  • Wes OudshoornWes Oudshoorn, over 9 years ago

    I think the 3 hours design is great. I do that often, it feels great.

    Also, skip anything that is pure variation instead of improvement. Are you just trying stuff with type or is something bothering you?

    0 points
  • Robert FarrellyRobert Farrelly, over 9 years ago (edited over 9 years ago )

    For me it come down to 3 things.

    Experience, confidence and shortcuts.

    Also always remember —broadstrokes first, details later.

    0 points
  • Jake PetersonJake Peterson, over 9 years ago (edited over 9 years ago )

    I think that my most effective designs are 80% planning and 20% execution. If you've already created the systems and practices for the project, then executing is less about asking questions and more about putting in the answers. Color choices may seem unlimited but are easily narrowed with attention to psychology and cultural history.

    It's fun for all of us to explore every visual possibility in a project but you can always save those ideas for the next one. Each project will always have an iterative process, but the biggest iterative project to worry about is yourself. Putting everything you have into one project will burn you out eventually.. Tortured artists have the freedom to do that but designers need sustainability and some structure in the creative process.

    0 points
  • Javier CroccoJavier Crocco, over 9 years ago

    This reminds me this article

    http://blog.gibbon.co/posts/2013-05-15-grumpy-designer-syndrome.html

    0 points