This is part 2 of our 3 part series on design execution and the craft side of design. These are not in any particular order but are certain things that I do when approaching my work. Before we get into the nitty gritty. The first and most important thing before you do any hands on stuff is to understand a project's goals - what outcomes do you want to achieve? And secondly know and understand the end users that you are designing for - What do you need to design and deliver for users to be delighted? ie. A quicker way for users to achieve their goals? Something that is beautiful and aspirational that users can relate to? etc. This should be the guiding north star for everything you do in the execution phase. Now that I’ve got that out the way here’s some things I do in my workflow, hopefully they can help you as well.
Start with rough ideas and iterate
To begin with I always find it beneficial to start loose and fast. Uncover as many options as you can – whether that’s to draw different layouts on paper, play around with many type and colour options, different design directions, or focus on 1 core feature that you can innovate the shit out of. Anything that you can latch on and build off of to gain some momentum. You can get a snapshot of that process here.
Think holistically about a product/site/apps flow
Next is to think about the total experience. You begin to do this with wireframes, or doing an audit of an existing site and improve the IA based on business goals and user needs. You could also listen to users, what they currently get out of the experience and what is currently lacking. Conduct surveys etc. Next is to go deeper about the experience. Beyond just your interface. Airbnb use storyboards to visualise the customer experience, which I think is a great approach if you have enough time and project scope to flesh one out. You can read about it here. Otherwise you can take a step back when you are designing, beyond the pixels staring right back at you and think in what mode, circumstance would someone be using the product you are designing. Humanise the experience, it is more than just pixels on a screen. It is about helping someone do or achieve something. Put yourself in their shoes, how can you make this better? Then think holistically about the overall experience. From everything that occurred before they engaged with your product, what was the trigger? Where were they? What were they doing? To everything that occurs after they engaged with your design. Unboxing a product, support etc. Design for that need and that person.
Use a grid
Grids are great, they builds consistency and gives coherence and structure to your work. Here I’ve used a 12 column grid. With a 14px baseline grid with the body type set with Freight Text 18px and 28px line height. I usually use the body copy size and font to determine the height of the baseline and use that as the scale for the rest of the site/app.
Define styles – create a design system
Create a basic styleguide or UI Kit for your projects so that there is consistency and hierarchy across the board. If you have multiple designers on a project it is fantastic to have a coherent visual language that you can all use and consistently create with. What I have in the basic styleguide is - typography, colours, buttons & ctas, sprites and content blocks. With this you can easily create new pages, components and blocks to add to your existing site/product.
You can view more design languages and systems of various companies here.
Collaboration and iteration is part of the workflow
Work closely with clients and expect iterations to occur. That’s how you come up with work that is effective. Don’t get pissed about changes. Changes are obstacles and opportunities to make the work even better. Use redpen and invision to go through concepts with clients. Share the same vision about a project goals and what you both(stakeholders) want the outcome to be. Many designers think clients destroy websites, but if you’ve collaborated properly it is not an ‘us’ vs ‘them’ mentality. You’re on the same team. Stop trying to make stuff for your folios, work to solve problems first and foremost. How can you help the client create a better experience for their customers, how can you help make the clients business more of a success? Or how can you help make the client look better to their boss? How can you give them assurance and deliver on the best outcome possible. Learn to be a designer that works to these standards and then try to make the work beautiful as a byproduct of these goals and not because you want cool stuff for your folio or dribbble.
Alright those are my tips for this week :)