PROJECT BRIEF
I will create a fully functioning website for my future web design business. I will begin with research and planning, then sketching, mockups and user testing, then revisions and additional user testing. I will then build the website and go through at least three rounds of testing and improvements before deploying my website online.
1. RESEARCH
Clay Global - mobile site
Clay Global - desktop site
I really like how clay global demonstrates a lot of their designs and several of the big name companies that they have worked with on their home page. I think their use of white space is helpful to draw the viewer's eye to the most important things on the page. I also really like how they focused their branding on black and white in order to let the designs fill the site with color. It really made the designs stand out.
2. Elizabeth McCravy - desktop site
I really like how the EM site looks like a magazine. It is jam-packed with information, but is so pretty and with great visual hierarchy that it is still easy to read and understand. Her color scheme is also really pretty, but I feel like she is stuck using only work and photos that go with her own branding and color palette.
3. Red Olive - desktop site
I really like the red olive site because it also uses black and white as the main colors, but adds splashes of red to direct the viewer exactly where they want them to look. They also did a good job at highlighting large clients that they have worked with on their home page. The large images and white space look great. I also really like the typography they chose. It is simple, but not boring.
2. SCENARIOS
SCENARIO 1
You are starting a new business and need to find someone to build you a website. Use the website to view what High Vibe Marketing offers and what is included in their web design and development package.
SCENARIO 2
You own a hair salon and are looking to rebrand and up your marketing game. You are familiar with High Vibe Marketing from social media and have heard good things from your friends who have worked with them before. You want to request to work with them. Use the website to request a new project with High Vibe Marketing.
SCENARIO 3
You are a new web designer and want to learn some tips and tricks from professionals. You have heard that High Vibe Marketing shares a lot of helpful tips on their blog. Use the website to find the blog and check out the latest posts.
3. WIREFRAME
4. SKETCHES
I really enjoyed sketching my designs because I had a pretty good idea what I would want in my head. I have been dreaming about this website for a long time and it is really fun to finally put a pencil to paper and bring it to life. I was able to incorporate some of the things I liked from the websites above.
5. 1ST ROUND OF USABILITY TESTING
USER 1
User 1 was able to navigate through the mobile site, but was not able to locate the web development package. They mentioned that they really liked the layout of the mobile site so far.
USER 2
User 2 was able to get through the desktop and mobile sites correctly and reported concern. for the large words in front of images. They also asked where the majority of the text on the site was going to be as it mainly only has pictures now.
6. DIGITAL SKETCHES
7. 2ND ROUND OF USABILITY TESTING
USER 1
User 1 was able to navigate through the mobile site, but was not able to locate the web development package. They mentioned that they really liked the layout of the mobile site so far.
USER 2
User 2 was able to get through the desktop and mobile sites correctly and reported concern. for the large words in front of images. They also asked where the majority of the text on the site was going to be as it mainly only has pictures now.
8. NOTES FOM MY MENTOR
"Make sure to design with the user in mind. What are they expecting to see when they come to your website? What are their intentions and desires? Make sure to give them the easiest route to get what they want. Overall, your digital sketches look great. You might run into some issues with your type overlapping your photos, so pay attention to that. " - Joe Upshaw, Mentor
9. DIGITAL SKETCH REVISIONS
10. 3RD ROUND OF USABILITY TESTING
USER 1
User 1 liked the layout of the desktop and mobile site, but stated that the words really blended in with the photos. They mentioned that they were concerned the words need to be offset from the photos or darker in order to be legible.
USER 2
User 2 was able to navigate both the mobile and desktop site, but had an easier time navigating the desktop site. They reported that it was challenging to switch from one page to another on the mobile site because many of the things they clicked didn't take them anywhere.
11. ADDITIONAL REVISIONS
13. 4TH ROUND OF USABILITY TESTING
USER 1
User 1 was also able to complete all tasks on the website. They liked that they were able to have more information and were able to read all of the headings this time. They recommended updating the headings on the blog page so that they don't overlap with the images.
USER 2
User 2 was also able to navigate the website without asking for help and complete all tasks. She mentioned that the site was easy to understand and she liked that she could fill out the form and submit it.
14. NOTES FOM MY MENTOR
"Your website is really coming along! I think the changes you have made so far will be extremely beneficial to your viewers and clients. I'd recommend adding a lot more information so that your potential clients know exactly what they would be getting by working with you. You don't want them to be confused or unsure. The feel of your website is very fresh and modern as well. Good work so far!" - Joe Upshaw, Mentor
15. FINAL DESIGNS
16. CONCLUSION
This project was way more work than I had expected, but way more fun as well! I really enjoyed being able to design exactly what I want for my future business and go through user testing to really sharpen the user experience and interface. I learned that there will always be things that I want to update and change, but that the user's opinion is infinitely more important than my own. I am so grateful that I had the opportunity to create this website and can't wait to add my own photos and get my business up and running!
