E-commerce Project Juri Seo Stefania M Lukito
IM 231 Inteface Design SP’12 | 23 May 2012
Statement Creative Brief
Background Bad Kitty Clothing was born in early 2001, in Los Angeles. It has become a thriving business providing great shopping for teen clothing and women’s apparel ever since. This site has been created 2001, and ever since that it has not done any improvement for the web design. Target Audiences The audience that they target is young women in U.S. who love cute, edge feel of casual wear. Objectives Redesigning this website needs to clarify branding of the logo, reorganize navigations, improve user friendly navigation, and attract to buy the products. Developing recognized brand and incorporate the logo to same feel of the website will brings recognizable brand in the industry and brings more customers. Obstacles Obstacle may be let regular customers can get familiar with new navigations in short time without confusion, so they feel comfortable with a new interface. Key Benefit Redesign Bad Kitty will create a wanting brand image through the young women and the audience will want to be a part of the brand by wearing and visiting the webstie. Connecting a social network sties and pinterest to boost traffic to the website. Tone Bright, eye catcher colors Media Web page IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Mood Board Inspiration
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Style Guide
Primary Colors
Navigation: Gill Sans Bold Body: Gill Sans 14pt
Xerovit, optis qui autE cum et que ernam, quunt que aut as magni hic temped quis non reic tota dolupie nimendi sinctatem.
R: 255 G: 41 B: 133 #FF2985
R: 13 G: 217 B: 255 #0DD9FF
R: 255 G: 255 B: 0 #FFFF00
Secondary Colors R: 255 G: 232 B: 245 #FFE8F5
R: 153 G: 153 B: 153 #999999
R: 255 G: 122 B: 171 #FF7AAB
R: 102 G: 102 B: 102 #666666
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Original site
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Competitive Analysis
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Competitive Analysis
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Competitive Analysis Cart
Navigation Bar
Tone
Sub Navigation
Social Button
Products Page
Free People
Top
Light
Left Horizontal
Bottom
Product thumbnails with product name and price
Slide show images and some advertisements
Hollister
Top
Dark
Left Horizontal
Bottom
Product thumbnails with product name and price
Slide show images and some advertisements
Dripping in Fat
Top
Light
Left Horizontal
Bottom
Product thumbnails with product name and price
Scrollable products
Itself
Top
Light
Left Horizontal
Bottom
Product thumbnails with product name and price
No home page
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Home Page
Process
Logo Sketch
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Concept Sketch
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Concept Sketch
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Process
Wireframes
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project
Final
IM 231 Interface Design / SP’12 / Juri Seo & Stefania Lukito / E-commerce Project