Web Page Mockup Project

10afinalbethanyb

1. Description: I created a website design for Mara & Company.
2. Process (Programs, Tools, Skills, FOCUS principles): I began with drafting. I had several ideas for the design and it helped a lot getting them down on paper. Here are my sketches.img_0520img_0519img_0517

In the end I decided to combined several of my ideas which lead to the creation of this shape map which guided me as I built my final project. While working on both the sketches and the shape map, I tried to focus on organization and simplification. I didn’t want my audience to be overwhelmed with information. Once I had my shape map, I got started on my final. As I was working on it I made a few changes. I decided that I didn’t want to have holiday graphics and I also chose to have the social media plug next too the search bar.

10a-shapemap-bethanybertagnole
3. Critique Report: Mara Done, who inspired the made up company “Mara & Company,” helped me organize my elements and also let me know which elements worked best. She helped me build the layout of the website. I also talked with art major Rae Bridgewater. Rae helped me to find the right fonts for the project. She also helped me with simplifying and organization.
3. Message: My message reading can be fun and relaxing.
4. Audience: People who are interested in not only reading books but also in learning about new books that they might like. 
5. Top Thing Learned: I learned so much from this project but the top thing that I learned was that balance is very important. Balance helps the reader to stay interested. 
6. Color scheme and color names: Monochromatic//Blues and Blue-greens 
7. Title Font Name & Category: Charter (font for logo, I couldn’t find this font again so I used Mongolian Baiti for the headings) //Oldstyle
8. Copy Font Name & Category: Gill Sans MT//Sans Serif
9. Thumbnails of any original, unedited image used in the project: 


10. Source of each image (website name and hyper link): https-bittenbythefantasybug.files.wordpress.com20150471icr41ufl
https-literarytreats.files.wordpress.com201111giver
https-scififantasylitchick.files.wordpress.com201601the-help-book-cover
https-s-media-cache-ak0.pinimg.comoriginalse9bbbae9bbbaeea58e997437ce76c3bb9a4254
https-thatcovergirl.files.wordpress.com201207rowell_ep_us
https-upload.wikimedia.orgwikipediaenffeHarry_Potter_and_the_Cursed_Child_Special_Rehearsal_Edition_Book_Cover
http-compellingreads.co.ukwp-contentuploadscvr9781471111297_9781471111297_hr
http-images.huffingtonpost.com2015-09-18-1442617097-8680710-TheBestofMe
http-vignette1.wikia.nocookie.netolympiansimages88dThe_Lost_Hero.jpgrevisionlatestcb=20151117024147
http-www.adweek.comgalleycatwp-contentuploadssites11201503A1rBZedGc0L
http-www.chatelaine.comwp-contentuploads201212Me-Before-You-book-cover-Jan-12-p122
http://media.istockphoto.com/photos/popular-social-media-icons-picture-id513804382?k=6&m=513804382&s=170667a&w=0&h=0DM3KpHrwlYBDhKGsn7raJ45oRMMqaqu4jr-4ZoacCg=

2 thoughts on “Web Page Mockup Project

  1. Shelby Griffitth says:

    Hi Bethany! I really enjoy looking at your webpage! I think it was nice to look at a trending book page with different categories for everyone. I really like the colors, your font, and the logo. You put a lot of effort in this, I can tell. Great job!
    -Shelby

    Like

Leave a comment