Web Page Mockup

katrinatolman-website1. Description: This project is a made up of three sketches, one wireframe, and one final website design.
2. Process (Programs, Tools, Skills, FOCUS principles): I used Photoshop, and Illustrator for this project. I redid my logo, and changed it several times based on the different pictures I liked for my background on my final webpage design. I was able to make a grid out of squares and change the squares to different colors within the color scheme of my picture to create the look I did. I used several tools within the programs I used to make the look I wanted. I also made an easy navigating page that guides your eyes easily throughout the page.
3. Message: That I am an artist with a free heart and spirit. I love the outdoors and creativity.

4. Audience: Outdoorsy people with a passion for art and  creativity.
5. Top Thing Learned: The process of how to create a website, that it takes preparation and steps and isn’t made without sketches and wireframes first.

6. Title Font Name & Category: Shadows into Light, Category: Decorative
7. Copy Font Name & Category: Playfair Display Italic, Category: Serif
8. Thumbnails of any original, unedited image used in the project:

website-background

 

 

 

9. Source of each image (website name and hyper link):  https://pixabay.com/en/oregon-mountains-sunrise-dawn-fog-1885676/

 

These photos below are the sketches done in preparation for my wireframe and design of my website. I made each of these to brainstorm different ways I wanted my website to look. The first made a design for the second image, but after creating it, it didn’t grab my attention as I would have hoped, so I recreated a new one, using the first sketch. I did a wire frame of that as well, and designed it for my final project.

katrinatolman-sketch1katrinatolman-sketch2katrinatolman-sketch3
katrinatolman-wireframe

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

This pink and white picture is a wire frame of how my website would look with boxes and brief titles so I could get a better idea of how it should be. With this basic outline, it made things a lot easier to put in my actual images and logo, knowing that things were in alignment.

katrinatolman-websiteThis photo above is my website that I created out of my sketch and wireframe. I love the way it turned out. It has a unique look and would capture my interest if I visited it on the web.

 

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