Cupcake Delights by Christina Style Guide

Overview

Site Purpose

The purpose of this website is to showcase what is available to order for Cupcake Delights by Christina. The content displayed will help inform customers what is available to be purchased and made through Christina's home-based bakery.

Target Audience

The target audience will be women from ages that will range from 20 to 65. Typically, there is a higher percentage of women that order than men. The men are usually the ones to pick up the order. These are women in the community that live within a 60-mile radius of Christina's residence where she does all her baking. The average income salary of people who purchase through Christina is about $65,000. They are married and families that they like to celebrate milestones with. Their occupations are stay-at-home mothers and working mothers. These are women that use mobile devices often to find deals and honest places to do business with. They rely heavily on reviews to make their decisions.

Layout

Sitemap

Cupcake Delights by Christina Sitemap image

Wireframes

Cupcake Delights by Christina Wireframe 1 image Cupcake Delights by Christina Wireframe 2 image

Photoshop Design

Download the Cupcake Delights by Christina Photoshop design file

Branding

Website Logo

Cupcake Delights by Christina Logo image

Color Palette

Purple and pink were typical colors that I noticed on bakery websites with the burnt reddish-brown color. I chose purple to coincide with the logo. Purple is known for elegance and a touch of class. I'm hoping to send that message that the products offered are exceptional and good quality.

Lavender

#dfcbe3
223, 203, 227

Purple

#ae7dba
174, 125, 186

Reddish-Brown

#754300
117, 67, 0

Dark Blue

#280742
40, 7, 66

Typography

I wanted the heading font to be similar to cursive writing on a cake. I'm also going to be using that for the title to make it look like handwritten words because part of the title is the owner's name. For the body copy, I chose a sans serif that was a little more compact so it would contrast well with the decorative font that had a more pronounced line-height.

Lobster Two - Heading Font

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890!@#$%^&*()_+

Sample Heading

Lato - Body Copy Font

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890!@#$%^&*()_+

Lorem ipsum nonsed eicillabore essum fugit lantisit, si nis eictia num fugiam et quatquis resto eossitem quunt quae sit dolupis maio omnimo il id maio bea ipid que conseque volorem. Et facidebit vel ma doluptasitis num, ullandebit hicto beaquos tiumquis postrum cori odit eosam quiatur? Volo quid minvel earuptatem quiatur?

Mod qui quunturiam idenderro ma et ex ex ex exerum faci repel molut evelign amenduciis moloreperum qui nullupt ustrumet, sequi a pre non net is dia comnimusant isque voleseque eatur simpori beruptae quam fugit eostios quasi nulpa quatur molorero quam eventio ma venis quideri atiaturione volupiscia sime denestis et hil magnatem aliquundella cusanihit fuga. Pienia dolo tem voluptassi volor as voluptae nulla sed maximincium sapelen tiatqui busapernatus aspis as aborioreic tet recta volessu ndelit hil is explame niminve ratur? Mus andebis si adipsamus ad moluptiae cum este verupid es sequam veri tem sequi re volum doluptatque veriorepudis et, tetum as porem et que sim natiis doluptatures et, sam rehent alicipis suntio conestio ipsandam que prem idi quiasped mod maximod iatium ex et quassimin nonempo reperisci te nonsedit ut auta volorisque paribus.

Navigation

Main Navigation

Secondary Navigation

HTML Elements

Headings

h1

h2

h3

h4

h5
h6

Lists

Unordered List

Ordered List

  1. Item 1
  2. Item 2
  3. Item 3

Links

Link style 1
Link style 2

Paragraphs

Lia sitio blabore ruptatium, to dolorum erum siniscia cor serum sinum solupti aecepe dolupta quiaturion exerum quasi ut et eatemolorem fugit, adistis ab in et dolectem venda custisint occabor esequas core mod est, anditium everes as idundae rferferferi qui re dit eaquo veliquia qui totatiam denis iniscii squatur?

Ant aliquias alis es ma proribus. Solest, officiendic tem eatibeatium re voluptas es diae eate a eostrume nis il erum facit et ex est, ipsae cum simodi tet quos ma volupta aut latur, et quamus nobis netur seritius excero voloratuscia essequaspis sequo cus, everum nissit et fugiaeperor acepedit quatiam et eum volo dicaeribus dest lab illiqua temporrum, que quam que perovidus, voluptatur, officto doluptata nempore icipsapid eatas es eum quiaspis earum que offic tem fugita voluptatinis quis as audigen derferf erition sectasitia solupta nam net quatur andis del ium re enihit aut apelist et es milit quaes ulles expliquunt volorum eictium quia iur, nis dit asped estiatem.

Figure & Figcaption

Ghostbusters Fondant Cake
Ghostbusters Fondant Cake

References

Links to Web Design Examples

Links to images, textures, or other borrowed assets