Pimples & Wrinkles Campaign

Research & Goals

Print & Identity

About P&W

Business Card

Word Cloud

Promotional Flier

Project Goals Digital Design Guidelines

Website

Logo

Social Media

Logo Usage Common Logo Misuses Color Palette Typefaces Common Type Misuses Layout & Grid

prepared by

Research & Brief

About Pimples & Wrinkles

Pimples & Wrinkles is a blog / website providing skin care product reviews and articles. Using personal experiences and product testing to help the public make accurate decisions when purchasing skin care products. Communicating these helpful skin care reviews and tips in the form of a blog. “Our goal is to provide a site that has clear and unbiased reviews of skin care lines, written by women who actually have (or hopefully had) real skin care problems. We want to help arm you with the right products for your skin care arsenal. In short, we want to pass on what we learn to you and provide a forum to hear your thoughts as well.�

3

pimples & wrinkles Research & Goals

word cloud

conversational social media

feminine

fresh

reviews

skin care community blog

4

pimples & wrinkles Research & Goals

Project Goals

Branding / Creative

Content

To successfully create a recognizable “face” via color, mark,

CMS: Custom-Style Wordpress implementation

typography, hierarchal grid, and unity—that communicates

Products: Ability to import/export product lists,

the purpose and voice for Pimples & Wrinkles.

automatically generate pages by import Searching: Tag based & text

Functionality

SEO/Analytics: Optimized for SEO. XML Site map, Relevant

User Accounts:

Meta Tags, Analytics tracking Advertising: Click referral

Public Profile—Photo, Location, age, skin type Opt in

programs, randomized ads

& out to newsletter mailing list Ability to create Product

Filtering: The ability to view content based on your interests

lists, and “routines” Ability to Rate & review lists / routines

(not necessary but would be amazing)

The ability to tag, and sort routines for searching Communication: Mailing List sign up Share with ease, Social media Forums / FAQs or Q&A

5

pimples & wrinkles Research & Goals

Design Guidelines

Basic Logo

Notes:

Logo should be used on a white background, in green only. No smaller than 200 px. (web) or 1.25� (print).

7

pimples & wrinkles Design Guidelines

Logo Sans Talk Bubble

Notes:

Logo should be used on a white background, in green only. No smaller than 200 px. (web) or 1.25� (print).

8

pimples & wrinkles Design Guidelines

Web / Other logos

Notes:

featured article

face off

desert island pick

9

pimples & wrinkles Design Guidelines

Can be used on posts, or images.

Can be used with social media as well.

Web / Other logos

P&W F E AT U R E D R E V I E W

P&W F E AT U R E D R E V I E W

Notes:

Can be used on posts, or images. Can be used with social media as well.

10

pimples & wrinkles Design Guidelines

P&W F E AT U R E D R E V I E W

P&W F E AT U R E D R E V I E W

Logo Clearspace

Notes:

Minimum clearspace must equal the x-height of the logo.

11

pimples & wrinkles Design Guidelines

Logo misuses

The logo is designed for a highcontrast background and should not be used on low contrast and or clashing backgrounds.

Not providing the appropriate amount of clearspace between a margin and the logo.

Not providing the appropriate amount of clearspace between content and logo.

12

pimples & wrinkles Design Guidelines

Basic Palette accent colors

R G B : 1 02 , 65, 1 1 6

RGB: 1 65, 89, 129

RGB: 129, 65, 116

RGB: 193, 92, 129

R G B : 121, 122, 125

C : 6 8 m :86 y:26 k:1 0

C:3 6 m:7 7 y:27 k:2

C:52 m:86 y:26 k:10

C:20 m:7 7 y:27 k: 2

C : 0 m: 0 y:0 k: 70

HEX : 6641 74

H EX: a55981

HEX: 814174

HEX: c15c8 1

HE X : 797a 7d

PANTONE: 261 2

PANTON E: 689

PA N TON E: 8125

PA N TON E: 118 -3

PA N TON E : 8 421

13

pimples & wrinkles Design Guidelines

Typefaces

AaBbCc AaBbCc S c a la

S c a la Sans

AaBbCc AaBbCc Sca la Sa ns Sma ll Ca ps

Gotha m

Type Usage

Headline

Headline

Lorem ipsum dolor sit amet, consectetuer

Lorem ipsum dolor sit amet, consectetuer

adipiscing elit, sed diam nonummy nibh euis

adipiscing elit, sed diam nonummy nibh euis

mod tincidunt ut laoreet dolore magna al

mod tincidunt ut laoreet dolore magna al

iquam erat volutpat.

iquam erat volutpat.

F o r P rint:

For w eb:

h e a di ng : 24/28 S cala Sans

hea ding : 24/30 Sca la Sa ns

co py: 1 0/ 1 6 S c ala

copy: 11/ 17 Sca la

14

pimples & wrinkles Design Guidelines

Notes:

Paragraphs should not be indented—paragraphs should be shown as a line space equaling 1.5 x the line height. Line length should not exceed 40 em.

common type misuses

Headline

Uneven line-height and letter spacing.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euis mod tincidunt ut laoreet dolore magna al iquam erat volutpat.

Headline Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euis mod tincidunt ut laoreet dolore magna al iquam erat volutpat.

15

pimples & wrinkles Design Guidelines

Not enough space between header and first paragraph,

layout and grid

a logo

b d

c

a all layouts should follow a strict left-flush alignment only B logo should be included on the top left of any document / ad with the proper use of clearspace C margins should be congruent on all sides D space between content should match margin widths

16

pimples & wrinkles Design Guidelines

print & identity

Business Card draft 1

robin levine Contributing Writer

t 212.453.8754 e robin@pimplesandwrinkles.com www.pimplesandwrinkles.com

f r o nt

back

elizabeth levine Contributing Writer

t 212.453.8754 e elizabeth@pimplesandwrinkles.com www.pimplesandwrinkles.com

f r o nt

18

pimples & wrinkles Print & Identity

back

Promotional flier draft 1

A no-holds barred site for the skin care obsessed, reviewed by two lifelong devotees! On the quest for your perfect skin? Let us arm you with the right tools & reviews. www.pimplesandwrinkles.com

19

kles & Wrin

ting the prin text of e ummy been th as h mply d si m is Ipsu Ipsum . Lorem e 1500s, ry th Lorem st u ce d n g in ever si esettin my text pe and and typ ard dum ley of ty ’s stand ok a gal ry to st r u te d n . in k n pri en boo unknow specim when an e a type to mak it d le scramb

imples

About P

pimples & wrinkles Print & Identity

ere

ere

logo h

logo h

ere

logo h

rinting of the p e my text m u d been th ly m has is simp m Ipsu 0s, Ipsum ry. Lore the 150 Lorem st u ce d n si in g ever esettin d my text type an and typ ard dum alley of ’s stand took a g r te n industry ri np book. unknow ecimen when an type sp make a to it d le scramb rinting lizabeth of the p e my text About E m u d been th ly m has is simp m Ipsu 0s, Ipsum ry. Lore the 150 Lorem st u ce d n si in g ever esettin d my text type an and typ ard dum alley of ’s stand took a g r te n . industry k ri np en boo unknow specim when an e a type it to mak d le b scram

obin

About R

Promotional flier draft 1

A no-holds barred site for the skin care obsessed, reviewed by two lifelong devotees! On the quest for your perfect skin? Let us arm you with the right tools & reviews. www.pimplesandwrinkles.com

20

pimples & wrinkles Print & Identity

Promotional flier draft 1

About Pimples & Wrinkles Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

logo here

logo here

logo here

About Robin Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

About Elizabeth Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

21

pimples & wrinkles Print & Identity