Tiffany Lin Website Case Study

Case Study for www.tiflindesign.com Website Design Created By Tiffany Lin 10/2013 V1

Case Study for www.tiflindesign.com Website Design

philosophy Understanding and witnessing transitions between content and visual design play big in my work and the process in which I work. The relationship between those two items ultimately brings focus to the message of the project and how that message will be communicated to the client’s audience.

To bring that story to the forefront means providing the audience with a solid foundation (simple backgrounds), focused presentation (large images, clear categories), a narrative to follow (process sketches, case studies), and personalization (an about page with resume and philosophy copy to cater to freelance projects and larger companies/agencies. Along with links to my online personalities).

Page 2

Case Study for www.tiflindesign.com Website Design

Page 3

Audience

Site Goals

Freelance Clients

Easy to use, intelligent G/Ui/x

(Artists, Museums, Non Profits, Small Business)

Portfolio to show:

Design Firms/Agencies and Tech Startups

Scope, Consistency, Process, Voice

(Art Directors, Creative Directors)

Work Experience to show:

Non-Design Companies

Team and lead experience, growth, stability

(Marketing Leads)

Web Presence/Reputation (social media links, blogs)

Colleagues

Contact Info

Case Study for www.tiflindesign.com Website Design

inspiration

Page 4

Case Study for www.tiflindesign.com Website Design

mood board

Page 5

Case Study for www.tiflindesign.com Website Design

map

home

index.html

projects

#projects

contact #contact

project details

/project-name

Page 6

Case Study for www.tiflindesign.com Website Design

Sketches

home projects

project details

contact Page 7

Case Study for www.tiflindesign.com Website Design

Projects Page Development original

Side Nav

visual cue TOP top Nav

Page 8

Case Study for www.tiflindesign.com Website Design

1023 px

wireframes

TEXT HERE

TEXT HERE 1660 px

Page 9

Case Study for www.tiflindesign.com Website Design

wireframes

TEXT HERE

TEXT HERE

PROJECT NAME

Page 10

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECTS

CONTACT

PROJECT NAME PROJECT NAME PROJECT NAME PROJECT NAME

Page 11

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECTS

CONTACT

PROJECT NAME PROJECT NAME PROJECT NAME

PROJECTS CONTACT

PROJECT NAME

Page 12

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECTS

CONTACT

PROJECT NAME PROJECT NAME PROJECT NAME PROJECT NAME

TOP

Page 13

Case Study for www.tiflindesign.com Website Design

wireframes PROJECT NAME PROJECT NAME

PROJECT NAME PROJECT NAME TOP

Page 14

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECT NAME This album is a collaboration between an electronic musician and an acoustic instrument player. The album represents a melding of old and new. I’ve decided to use mixed fonts and simple shapes and lines to call back on old theater posters, but using clean lines to give a sense of the modern. This album is a work in progress and will be screen printed.

Page 15

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECT NAME

This album is a collaboration between an electronic musician and an acoustic instrument player.

Page 16

Case Study for www.tiflindesign.com Website Design

wireframes PROJECT NAME PROJECT NAME

PROJECT NAME PROJECT NAME

Page 17

This album is a collaboration between an electronic musician and an acoustic instrument player.

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECTS

CONTACT

PROJECT NAME PROJECT NAME PROJECT NAME PROJECT NAME

Page 18

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECTS

CONTACT

PROJECT NAME PROJECT NAME PROJECT NAME PROJECT NAME CONTACT

Semiotics sriracha aliquip Vice, velit seitan jean shorts synth single-origin coffee stumptown nesciunt cillum hoodie. Tofu hella kogi, Carles Austin et umami

Page 19

CONTACT

Semiotics sriracha aliquip Vice, velit seitan jean shorts synth single-origin coffee stumptown nesciunt cillum hoodi

Case Study for www.tiflindesign.com Website Design

wireframes

PROJECTS

CONTACT

CONTACT Semiotics sriracha aliquip Vice, velit seitan jean shorts synth single-origin coffee

ABOUT

Semiotics sriracha aliquip Vice, velit seitan jean shorts synth single-origin coffee stumptown nesciunt cillum hoodie. Tofu hella kogi, Carles Austin et umami chillwave tattooed single-origin coffee. Letterpress enim XOXO, YOLO

(c) 2013 by Tiffany Lin

Page 20

CONTACT

Semiotics sriracha aliquip Vice, velit seitan jean shorts synth single-origin coffee stumptown nesciunt cillum hoodi

ABOUT

Semiotics sriracha aliquip Vice, velit seitan jean shorts synth single-origin coffee stumptown nesciunt cillum hoodie. Tofu hella kogi, Carles Austin et umami chillwave tattooed single-origin coffee. Letterpress enim XOXO, YOLO

Case Study for www.tiflindesign.com Website Design

Styles FONTS novecento wide

logo

HEADINGS Sub Headings

lato regular

Fashion axe mlkshk next level farm-to-table, ex est locavore laborum Schlitz ethical forage Williamsburg Pinterest letterpress retro. Cosby sweater Godard PBR Wes Anderson drinking vinegar Schlitz. Ut synth sartorial High Life. Echo Park gluten-free fugiat pickled narwhal gentrify seitan, eu mixtape. DIY nesciunt bicycle rights, sriracha laborum ennui minim placeat. Bushwick Tumblr readymade adipisicing id.

Colors

Elit veniam Pitchfork typewriter, mixtape art party whatever culpa assumenda PBR.

Page 21

Case Study for www.tiflindesign.com Website Design

Hi-Fi

Page 22

Case Study for www.tiflindesign.com Website Design

Album Design

Hi-Fi

Lava Theif Records Album Design

CONTACT Email : Tiffany@tiflin.com Tweet @tiflin

about Tiffany works in her cozy Seattle studio, next to a photo of a gray wolf. She's been freelancing

for

years

and

almost

everything she's learned about design is self taught.

She’s worked with: Demand Media Apex Learning Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 23

Case Study for www.tiflindesign.com Website Design

Hi-Fi

CONTACT

Lava ThIEf Records

: Tiffany@tiflin.com AlbumEmail Design Tweet @tiflin

Rosoka Software Brand ID & Collateral & Information Graphics

about

Tiffany works in her cozy Seattle studio,

Soapworks Studio

next to a photo Website Designof a gray wolf. She's been freelancing

for

years

and

Seattle Phonographers self taught.

Union

almost

everything she's learned about design is

Album Design

She’s worked with: Demand Media Apex Learning

Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 24

Case Study for www.tiflindesign.com Website Design

Hi-Fi

CONTACT

Lava ThIEf Records

: Tiffany@tiflin.com AlbumEmail Design Tweet @tiflin

Rosoka Software Brand ID & Collateral & Information Graphics

about

Tiffany works in her cozy Seattle studio,

Soapworks Studio

next to a photo Website Designof a gray wolf. She's been freelancing

for

years

and

Seattle Phonographers self taught.

Union

almost

everything she's learned about design is

Album Design

She’s worked with: Demand Media Apex Learning

Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 25

Case Study for www.tiflindesign.com Website Design

Lava Theif Records Album Design

Hi-Fi The Cessation Elegy The album represents a melding of old and new. I've decided to use mixed fonts and simple shapes and lines to call back on old theater posters, but using clean lines to give a sense of the modern. This album is a work in progress and will be screen printed.

Projects contact

CONTACT

Lava Theif Records

Email : Tiffany@tiflin.com Tweet @tiflin

Rosoka Software Brand ID & Collateral & Information Graphics

about

Tiffany works in her cozy Seattle studio,

Soapworks Studio

next to a photo of a gray wolf. She's been freelancing

for

years

and

almost

Seattle everything she's learned about design is Phonographers self taught.

Union She’s worked with: Demand Media Apex Learning Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 26

Case Study for www.tiflindesign.com Website Design

Hi-Fi Lava Theif Records Album Design

The Cessation Elegy The album represents a melding of old and new. I've decided to use mixed fonts and simple shapes and lines to call back on old theater posters, but using clean lines to give a sense of the modern. This album is a work in progress and will be screen printed.

Lava CONTACT Theif Records Album Design

Email : Tiffany@tiflin.com Tweet @tiflin

about Tiffany works in her cozy Seattle studio, next to a photo of a gray wolf. She's been freelancing

for

years

and

almost

everything she's learned about design is self taught.

She’s worked with: Demand Media Apex Learning Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 27

Case Study for www.tiflindesign.com Website Design

Hi-Fi Lava Theif Records Album Design

Lava CONTACT Theif Records Album Design

Email : Tiffany@tiflin.com Tweet @tiflin

about Tiffany works in her cozy Seattle studio, next to a photo of a gray wolf. She's been freelancing

for

years

and

almost

everything she's learned about design is self taught.

She’s worked with: Demand Media Apex Learning Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 28

Case Study for www.tiflindesign.com Website Design

Hi-Fi

Projects

Contact

CONTACT Email : Tiffany@tiflin.com Tweet @tiflin

about Tiffany works in her cozy Seattle studio, next to a photo of a gray wolf. She's been freelancing for years and almost everything she's learned about design is self taught.

She’s worked with: Demand Media Apex Learning Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and Recreation The White Center Community Association

CONTACT Email : Tiffany@tiflin.com Tweet @tiflin

looking for tiffany lin, musician? visit www.tiflin.com (c) 2013 Tiffany Lin

about Tiffany works in her cozy Seattle studio, next to a photo of a gray wolf. She's been freelancing

for

years

and

almost

everything she's learned about design is self taught.

She’s worked with: Demand Media Apex Learning Novo Fogo Organic Cachacas The Wing Luke Museum Prefecture Music City of Seattle Dept. of Parks and

Page 29

Case Study for www.tiflindesign.com Website Design

Citations Sites for Inspiration 1. http://bjoernmeier.com/ 2. http://brokentwill.co.uk/ 3. http://gavinpotenza.com/ 4. http://www.omfgco.com/

Images Title Page: “View from Lake Ann, at the edge of Mt Baker Ntnl Forest.” Tiffany Lin, August 2013.

Hi Fi Home Page (22) : “View from Lake Ann, at the edge of Mt Baker Ntnl Forest.” Tiffany Lin, August 2013.

Hi Fi Project Page (24, 25, 26) : “Near Lower Curtis Glacier.” Tiffany Lin, August 2013 Product Detail Mockup Background (28) : http://www.behance.net/gallery/Outsiders-Artwork/10362083

Mood Board 1. http://totokaelo.com/ 2. http://designspiration.net/image/2041752651862/ 3. http://www.flickr.com/photos/martonjancso/6243909354/in/faves-paulgrech/ 4. Vintage travel poster of Greece designed by Freddie Carabott 1960’s #kitsakis http://www.pinterest.com/pin/8162843046308821/

Page 30

Case Study for www.tiflindesign.com Website Design