DEV Community

loading...
Cover image for What is your design process?

What is your design process?

fmctaggart profile image Fraser McTaggart ・2 min read

It is important to have a workflow that works for both you and the client

What are the stages to your design process?

Discovery

It is important to establish the scope of the project and also to gain insight of the company you are designing for. Ideally, a face-to-face meeting before work commences will help to ensure that you and your client's visions are aligned. Due to the global pandemic, a phone call and email questionnaire can also be used.

At this stage it is essential that you are happy with your relationship with your client. As with all relationships, if you get a bad feeling then it probably isn't worth persuing. Refund the deposit and say farewell!

Plan

At this stage a sitemap is submitted and discussed so that each party is happy with the general structure of the pages, and also the rough content that will be displayed. Next up, the designing can start.

Wireframe

I usually create black and white wireframes at this point. This will put down on paper the general layout and visual structure of the pages. I break these into components that can be reused, to ensure a consistent look throughout the whole site.

Mockup

Components can now be created fully in design software and the finer details can be discussed, such as colour, hover animations, button animations and visual prompts. Of course, some people trust your judgement ( that is why you have the job ) and this may not be required, or wanted!

Full Page Visual

Once everything is appoved, then we are free to create a homepage visual. This is one of my favourite stages in the process, and it is important to get correct. This will be the first real visual that the client will get, and sets the tone for the rest of the site. I usually spend a lot of time tweaking at this stage, ensuring that the site fit in perfectly with the company's branding.

Presentation

It is usually best to present the homepage design proposal to the client in person. You can gauge their reaction and also explain the decisions you have made. Why have you not put a giant chat window in the corner? Why can I not get every page from the navigation bar? Why have you not used the low resolution picture from my facebook page that has my mum in it?
Alternatively, present the visuals as responsive pages so the client can see a desktop and mobile version of the homepage.

If you have been thorough with the previous stages, then 9 times out of 10 there will be no changes required. You've nailed it. You can crack on with the code!

That's my process, what is yours?

You can find more articles on my website - www.mctweb.co.uk

Discussion (0)

pic
Editor guide