“How do you start a design?”
Yes, this is one of the many questions that most designers are used to being asked about - the ever elusive *Creative Process.* But more importantly to this blog post, this is the very question that I asked, while embarking on my first few designs here at Fastspot.
An empty artboard is a scary thing! Then throw in the added pressure of time constraints, pleasing the clients, pleasing the rest of your team, etc., and that blank screen becomes glaringly white. This kind of creative process isn’t the same as dumping out a box of crayons and suddenly finding the world at your fingertips. There is so much to consider when designing a website that taking those first steps may seem really daunting. So when I was discovered staring vacantly at my blank screen, the other designers at Fastspot stepped in with a lot of great advice on how to push past that initial, anxiety-inducing stage of a brand new project. Here are the helpful hints that I’ve found useful in avoiding blank-screen phobia and kicking off a fresh design with confidence and (maybe just a little bit of) ease.
Give Yourself Something to Work With
Start with the Basics
The first step when getting started on a design is to define your set of tools. Figure out what the color scheme is and whether it will go beyond the main branding colors. Develop the typography system, including a rough layout of the HTML styles (H1-H5, body content, block quotes, etc.).
I’ve always found it easier to work on a project that already had a design system in place. By giving myself something to work with ahead of time, it's much easier to concentrate on the more difficult portions of the design. Scott, a fellow designer at Fastspot, explained that when you give yourself these self-imposed constraints you also “encourage consistency” throughout your design process. This is an excellent place to start thinking about the project from a high level, before zooming in on the specifics in the content.
“Letterforms are very expressive — So choosing the fonts allows me to address project goals at an atomic level.” - Scott Opirhory
These initial typography styles and design choices will definitely change as you work through the page, but this will at least get you thinking about the project in terms of the aesthetics and hierarchy.
Content, Content, Content
It’s important to remember, when looking at a blank screen, that most likely, you're not actually starting from scratch. Another great set of tools for beating a blank screen are the deliverables created before getting to the design process, like the information architecture, content strategy, or wireframes. These documents will help inform you on the purpose of that particular page, the architecture of the full site, and what information/content needs to be included on the page. For instance, the purpose of the homepage may be to draw in potential applicants by showcasing the school’s vibrant community, using events, galleries and student testimonials. It will also introduce your navigation system and utility links for current users, like students and faculty sign-ins. Using these guidelines, you can pull in real content and start applying your design system to them.
“I try not to treat a working artboard as precious in any way, throwing as much content up as I can at first. 90% of it gets removed eventually, but when you make an ugly mess up front, things can only get better from there.” - Jesse Leyh
Get as much as you can (and everything you’ll need) on the page and then start narrowing it down from there. Again, a lot of this will change as you make discoveries through design. Going this route will not only give you all of the context you need to create the narrative of the page, it will make the artboard way less intimidating.
Before you know it, your design will start to evolve and you’ll have gone from a blank screen to a really good first pass at a design without even realizing it. Creating basic styles and gathering content are tasks that will inevitably need to happen, so if they do not spark your creativity, at the very least they are very productive forms of procrastination.
Know All the Things
Probably one of the most impressive parts of how Fastspot engages with a new project is the amount of time and effort everyone puts into getting to know each and every one of our clients and what they need from a website. Our goal is not to create generic solutions to unique problems (like adding parallax scrolling or other trendy web stuff), but to customize designs to our clients' strengths and weaknesses, making the solution very sustainable.
As a designer, this gives me tons of sources for inspiration and strategy. I feel like the more I know about a client, the easier it is for me to design for them. By taking the time to get involved with kick-off meetings, read through previous documents detailing the needs of the client (creative brief, information architecture, persona analysis, etc.), and keep up to date with the web in general, it really makes all the difference.
Call In Some Back Up
In the first round of Fastspot’s design process, we have three different designers create three completely different concepts based off of the same creative brief and architecture. This has many benefits for us, as well as the client. One of those benefits is having multiple perspectives working to solve the issues at hand. And, while one might think this part of the process would lead to designers working in a bit of a tunnel, it actually involves a lot of collaboration.
The most productive parts of my personal process are during design check-ins or casual conversations with the team. There are at least two other people (not including our UX team or management) who also know the ins and outs of the clients and the goals of their project. Whether it’s talking out an unbaked idea, workshopping the design and functionality of a component, or just being a voice of reason when you get stuck on an idea that doesn’t make any sense, being a part of an awesome team, that is willing to share fresh perspectives and help each other out, is key to kicking your design-block blues.