Web Design (Various)

Explaining my design process in building websites for clients

Startup, UX & UI Designer

Software: Wordpress, Shopify, Photoshop | 2019-2021

Process for Designing websites for clients

As a designer in my company (startup, Barter Bay), we took on client projects under the brand of PowderMonkey Studio (powdermonkey.ca). We used our expertise to help clients create or improve their websites to better fit their message and branding. This amalgamation of projects is to highlight my general process in website design. Each project is unique in its needs, and there can be some variations, but these are my general steps. 

1. Client QuestionNaire and research

I start with understanding the client and their business, by sending out a survey. Questions include the demographic of their audience, their competitors, an example of a website they really like, existing brand guidelines, and what kind of content they are planning on putting up on the website.
The answers guide me in the research to understand the standards of design and layout in their particular industry, and start thinking about the design style for their target audience.

client-survey

2. Proposed SiteMap

When I have done the research, and gotten a good understanding of the client's needs, my next step is to produce a site map of the content that the client wants in the website. This puts us on the same page on how the site would be navigated through primary and secondary bars. It allows us to discover early if any content is missing, or should be re-organized.

sample-sitemap

3. Moodboard/Examples

Based on their existing or ideal brand image, I present a sample of design styles from existing websites for the client.

design1-1
design1-2
design2-1
design2-2
design3-1
design3-2
design4-1
design4-2

4. Design sample pages for actual site

With one or two selected styles, I apply them and start with the design of the home page and one other important page. This is to give the client an idea of how the final work will look like, and also to make any style changes before committing to the final design.

sample-pages

5. Producing assets for the website

To give websites individuality and the wow element, I produce assets that are tailor-made for the brand, focusing on the most visible elements, like the header.

phoca-seal-logo-anim
citylights-anim
tech-floating-screens-anim

6. Handover and training

With the assets done, layout and style finalized, I then spend time building the full Wordpress website and integrate the contents. I give clients training on Wordpress on how to use the website so that they can make minor edits and add content (such as blog posts) themselves.


7. websites I have designed
noodle-arts-0
noodle-arts-1
phoca-1
phoca-2
phoca-3
integrum-mortgage1
integrum-mortgage2


← Back to my works

Contact me at vivieatto@gmail.com.

Made with ❤ using Blocs.