Whimsical Chocolate Site Plan

Jannelle Dickinson

WDD 130.02

Overview


Purpose

The goal of this website is to share personal interests in the world of using chocolate as an art form. This art is the best kind, the kind you can eat after your done with it. Yes, chocolate taste fantastic but it can also look amazing. Chocolate is not just for eating though. It can be used in a way that captivates your attention. For all those chocolate haters this might change their minds! Its ok if they don’t like the taste of chocolate. They are bound to appreciate the whimsical look of it on display. It takes time, money and lots of skill to craft these pieces into what is being shown.

Audience

My audience is for chocolate lovers everywhere. Maybe this audience is for people who should be converted to the chocolate side. Viewers will see the rich colors of the website pallet. It will hopefully mimic the look of the chocolate color pallet. The typography will be simple, clean, and understandable for the viewer’s comfort. The picture captions will give them understanding of the art that they are viewing as well. Art has never looked so good on a webpage before. This website will show them the artistic side of chocolate. Chocolate is not just for artistic taste it is for the viewers eyes as well.

Branding

Website Logo

Logo image

Style Guide

Color Palette

Palette URL: https://coolors.co/533747-5f506b-6a6b83-76949f-86bbbd

Primary Secondary Accent 1 Accent 2
#735751 #a78a7f #bf4342 #8c1c13

Typography

Heading Font: Noto Serif

I wanted to do a fun whimsical looking font for the header. I first tryed Lobster but I relized that it was a little hard to read and the tracking was not very good. I really wanted it to work but it was not worth it if the user could not read the information well, even if it was in a header.From my reading I learned that you could do a fun type of font for headers to attract attention.I feel that Noto Serif is fun and functional.

Paragraph Font: Source Sans Pro

From what I learned about typography San Serif is a clean and modern looking typography. I wanted to go with something in the family of Sans because this type of typography is known for being clean. Since this is for a paragraph, I wanted to have understandable words. My fun and crazy header typography would not be good for the paragraphs.

Normal paragraph example

The best Whitewater Rafting in Colorado, White Water Rafting Company offers rafting on the Colorado and Roaring Fork Rivers in Glenwood Springs. Since 1974, we have been family owned and operated, rafting the Shoshone section of Glenwood Canyon and beyond.

Colored paragraph example

Trips vary from mild and great for families, to trips exclusively for physically fit and experienced rafters. No matter what type of river adventures you are seeking, White Water Rafting Company can make it happen for you.

Navigation


Site Map

Home
Pinterest Link
Artist Hakan Martensson
 
 
 

The Site Map of a site is just like it sounds…it is a map of the pages in a site and how they are related and linked together. From the map above we can see that we will eventually have the Home page and 2 sub or child pages.

The lines that connect them all together indicate that each page should be accessible from any other page, it is essentially showing us the global navigation for the site.


Wireframes

Wireframes are like blueprints for making webpages. They should show the major sections of content that will be on the page and the relative locations of each element. In the wireframe below you can see there will be 6 sections to our page:

  1. At the top we have a section with the logo (the box with the mountain means an image) and the navigation bar.
  2. Then there is a banner image that stretches all the way across the screen.
  3. Next we have some text and an image
  4. ...followed by another row made up of an image and some text.
  5. Then one more section of text with no image.
  6. Lastly, a footer containing a copyright/name line and 3 social media icons.
home page wireframe family blog FAQ