Web Page Mockup Project

webdesign_mockup_final

DESCRIPTION

Design a website ‘Home’ page for the company used/created for our Brand Identity Project.

PROCESS (Programs, Tools, Skills, FOCUS principles)

  1. I started looking around at other clothing company websites to look for any inspiration on how I wanted to design the ‘Home’ page for the sock company “Feck”.
  2. Then, I started sketching out wireframes to help design the ‘Home’ page.
  3. After creating the wireframe on paper, I then went into Adobe Illustrator and redesigned a similar version of the wireframe I created on paper.
  4. After designing my wireframe in Illustrator, I started designing the actual ‘Home’ page using Illustrator.
  5. My ‘Home’ page ended up being a bit different than my wireframe after all the critiques and updates I put into my design. Below are images.

wireframe_2finalwireframe_matthewrapp

CRITIQUE PROCESS

We got together in groups during our last class and helped critique each other’s draft. Everybody was super helpful and suggested good ideas and critiques to help make my site look more professional. One suggested that I made the social media icons smaller and move them closer to the logo. Another person suggested I made the background color a light gray instead of white to make it pop a little bit more. Lastly, somebody mentioned I move my logo, in my head, to the center to make it show a bit more.

All critiques and thoughts I used in my final draft.

MESSAGE

To make colorful, creatively designed socks more trendy and popular.

AUDIENCE

Anybody interested in wearing cool, colorful, creatively designed socks.

TOP THING LEARNED

Using white space to my advantage and making sure that you are able to show the purpose of your company as best as you can in the most simple way. Keeping the web site design simple, easy to navigate through, and straight forward.

COLOR SCHEME & COLOR NAMES

Monochromatic // Black, White, & Gray

TITLE FONT NAME & CATEGORY

Myriad Pro // Sans Serif

COPY FONT NAME & CATEGORY

Myriad Pro // Sans Serif

THUMBNAILS OF ANY ORIGINAL, UNEDITED IMAGE(S) USED IN THE PROJECT

hu-nh-t-n-h-u-128665jake-ingle-140416megan-lewis-204933

SOURCE OF EACH IMAGE

Logo is my own // All Images from http://Unsplash.com //

  • First Photo by: Hayun Tan Hau
  • Second Photo by: Jake Ingle
  • Third Photo by: Megan Lewis
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s