Issuu on Google+

megan pettley DESIGN PORTFOLIO


2

Megan Pettley


Hello, I am a San Francisco-based graphic designer, enthusiastic francophile, and avid soccer player. Let’s create something!


Take a look Church Street Cafe - Rebranding

6-15

SF State Abroad - Branding

16-31

Ocean Beach as Artifact - Atlas

32-47

Foghorn App - User Interface

48-59

Paradise Lost - Type Specimen

60-73

Ida B. Wells - Special Edition

74-83


Church Street Cafe Rebranding / Identity

The objective of this project was to rebrand Church Street Cafe, a small coffee shop in the heart of San Francisco’s Castro district. The interior is warm and cozy, with steaming coffee and young professionals busy at work. The branding conveys this warm and intimate atmosphere with a rich color palette and vintage type treatment. As for the logo, the light bulb design reinforces said work environment.

Skills Used Adobe Adobe Adobe Adobe

6

InDesign Photoshop Illustrator Acrobat Pro

Megan Pettley


mood board / inspiration

8

Megan Pettley


sketches / ideation

EDITABLE ALTERNATES

str e et cafe cafe EDITABLE ALTERNATES

church MASTER EDITABLE street

church

EDITABLE ALTERNATES

cafe cafe

church street church

street church

church church church str e et

afe cafe cafe ca fe street

st.str c e et

cafe cafe cafe church

church street

st. church church st. st r e et


master logo

10

Megan Pettley


alternate logo


branding elements

Pacifico abcdefghijklmnopqrstuvwxyz

ABCDEFGHIJKLMNOPQ RSTUVWXYZ

1234567890!?*&@

12

Megan Pettley

Montserrat abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUV WXYZ 1234567890!?*&@


logo exclusion zone


branding in use

14

Megan Pettley


SF State Abroad Branding / Identity SF State Abroad is a part of the Division of International Education at San Francisco State University, and offers high quality exchange programs for students to participate in immersive, educationally rigorous opportunities. Before this rebrand, there was no branding in place. The set of logos were outdated and of poor image quality, and no standard color palette or typography existed. The new branding strategy is meant to speak to the student population, evoking a sense of fun and adventure while still maintaining its professionalism. The design encourages students to take a look at all the opportunites studying abroad has to offer.

Skills Used Adobe Illustrator Adobe Photoshop Adobe Acrobat Pro (all PC platform)

16

Megan Pettley


your guide to studying abroad


design audit

18

Megan Pettley


master logo

Master Logo combines the university’s emblem with SF State Abroad to establish credibility, but also to signify unity between the university and international education. Airplane acts as a representation of travel, and divides up the logo elements to enhance legibility.

20

Megan Pettley


alternate logos

Alternate Logos used when vertical or horizontal orientation is a better use of white space, instead of the taller, more rectangual shape the master logo creates.


trifold

Trifold emulates a letter, featuring a stamp from a country where a program is offered through SF State Abroad. Inside the letter is general information and images to peak readers’ interest and encourage them to attend an informational meeting. 22

Megan Pettley


informational flyers

Less crossing

Adventure is calling, for every major

fingers, more crossing borders.

AD! STUDY STUDY ABROAD! ABROAD! STUDY ABROAD! Getting accepted into the program is easier than you think. Over 96% of qualified SF State students were accepted. We’ll help you get there!

ed:

If you thought there wouldn’t be any international programs for your major, think again! SF State Abroad has programs for EVERY major.

Attend an Attend Informational an Informational Meeting toMeeting get started: to get started:

Attend an Informational Meeting to get started:

m.

Office of International Office Programs of International Programs M

10:00 a.m. M

10:00 a.m.

Office of International Programs

M

10:00 a.m.

m.

Building C @ Village Building Centennial C @ Village SquareCentennial Square T

11:00 a.m. T

11:00 a.m.

Building C @ Village Centennial Square

T

11:00 a.m.

m.

studyabroad@sfsu.edu studyabroad@sfsu.edu

W

2:00 p.m. W

2:00 p.m.

studyabroad@sfsu.edu

W

2:00 p.m.

m.

oip.sfsu.edu/studyabroad oip.sfsu.edu/studyabroad

Th

2:00 p.m. Th

2:00 p.m.

oip.sfsu.edu/studyabroad

Th

2:00 p.m.

Informational Flyers provide students with information regarding student acceptance rates, availability of programs for each major, transferring credits, and living costs. Each concept was transformed into flyers that are distributed throughout the SF State campus. 24

Megan Pettley


SFSU credits travel with you, wherever you go

SF rent: Abroad rent:

AD! STUDY ABROAD!

ted:

STUDY ABROAD! STU

All credits earned while abroad count as resident credits and go towards your major and other requirements.

Most destinations have cheaper living costs than San Francisco. You only pay SFSU tuition and your Financial Aid comes with you.

Attend an Informational Meeting to get started:

Attend an Informational Meeting to get started:

Office of International Programs

M

10:00 a.m.

Office of International Programs

M

10:00 a.m.

m.

Building C @ Village Centennial Square

T

11:00 a.m.

Building C @ Village Centennial Square

T

11:00 a.m.

m.

studyabroad@sfsu.edu

W

2:00 p.m.

studyabroad@sfsu.edu

W

2:00 p.m.

m.

oip.sfsu.edu/studyabroad

Th

2:00 p.m.

oip.sfsu.edu/studyabroad

Th

2:00 p.m.

a.m.

Atte


country flyers

FRANCE SKEMA Business School

What’s Next?

Finances

1. Info Meetings

Costs

Semester

Year

Come to a Study Abroad Info Meeting, held in the Study Abroad Office at the Office of International Programs, located in Village C in Village Centennial Square.

SFSU Tuition Airfare/Transport Housing Meals Books/Supplies Insurance Personal Total

$3,469 $2,200 $4,500 $2,250 $400 $307 $2,000 $15,126

$3,469

Monday 10am

Wednesday 2pm

Tuesday 11am

Thursday 2pm

OIP

2. Research

Requirements

Programs Offered

Dates & Deadlines

• Graduate Standing

• MBA programs only

• Academic Calendar Fall Semester: September - December

• 2.75 GPA or Higher

Spring Semester: January - June

• Language of Instruction: English

• Application Deadlines

• Priority will be given to students

For Spring Semester:

September 15th

with prior French course work

For Fall and Academic Year:

• Semester or year options available

March 1st

• Visit our website: oip.sfsu.edu/studyabroad • Click on “Search Programs” to access our database • Attend an Application Workshop

Scholarship Opportunities

3. Plan & Note Deadlines

5. Get Involved with IEEC

• Review Programs for academic fit • Check program specific requirements • Plan early and be aware that deadlines are often a year in advance.

The International Education Exchange Council (IEEC) is a student organization for anyone interested in studying abroad. It connects you with international students studying in San Francisco and study abroad alumni. • Join the mailing list at ieec@mail.sfsu.edu • Find us on Facebook (www.facebook.com/ ieecsfsu) and our group (IEEC Spring/Fall Year, i.e. IEEC Fall 2015) • Attend one of the many semester events!

4. Apply! • Click on “Apply Now” on our website: oip.sfsu.edu/studyabroad • Under “SFSU Student Registration” create an account then select a program and apply!

Potential Course Offerings The French Rivieria

SKEMA Business School

For more courses and the most current listings, visit: ht tp://www.skema.edu

Stretching along the coa st between the Alps and the Mediterranean, close to the Italian border, the French Riviera instantly evokes images of one of the world’s most glamorous regions, synonymous with go o d living, gourmet fo o d and fine ar ts. Visitors come for both business and plea sure: global trade fairs (musi c, real estate, telecoms, adver tising...) events such a s the Cannes Film Festival, jazz festivals in Ni ce and Juan les Pins. Those living here are able to enjoy the many natural advantages of the mountains and the coa st and will often boa st that they can ski in the morning and then go down to the beach to enjoy the sunset!

Created 44 years ago, SKEMA now caters to 2,0 0 0 students from over 60 different countries. Due to its exceptional lo cation at the hear t of Sophia Antip olis, Europ e’s leading science and technology park, this “Grand Ecole” benefits from close proximit y to go-ahead high-tech companies within an international environment. This major advantage enables the Scho ol to prop ose an original mo del of high p erformance for advanced training, benefiting from the close involvement of companies and adapting to their demands so that they can

International Business

Student Ex p erience Rep or t: http://www.sfsu.edu/~studyabr/Ex p erienceRep or ts/France SKEMA Ex p erience Rep or t.pdf

pursue their development in a sustainable fa shion. The impact of new technologies and innovation whi ch play a central role in pro duction pro cesses ha s been extremely imp or tant and ha s tran sformed the way of organizing companies, their networks, frontiers, and their need for skills.

Nice

est f the old is one o ttlements e s human , Europe in all of ck to a b g n ti da 0 years 400,00

Country Flyers provide students with information regarding study abroad programs in each country. Front page includes basic information, location and a fun fact about the city or university. Back page provides detailed informaiton about courses offered, housing, etc. 26

Megan Pettley

International Law, Taxation, and Finance International Management and Sectorial Dynamics Global Workshop: Knowledge Economy Managing International Organizations European Business Environment Intercultural Communication Globalization International Strategies Global Market Analysis Intercultural Management International Market Finance

Finance Financial Management Financial Markets International Corporate Finance Interpreting Macroeconomic Signals Financial Intermediation and Bank Management Country Risk Analysis and Emerging Markets Accessing International Capital Markets Investment Banking Commodities Financial Policy International Finance Options Futures and Other Derivatives

Tel. 415.338.1293

$2,200 $4,500 $2,250 $400 $307 $2,000 $15,126

Management

Diversity Management Mergers, Acquisitions, and Alliances Knowledge Management Supply Chain Management Business Events Management Leadership and Communication Skills Purchasing Strategic Management of Technology

Marketing International Marketing/Sales in Business to Business Effective Negotiation Skills Perspectives in International Marketing Consumer Behavior Advanced Advertising Strategy Communication and Advertising Tourism and Hospitality MGMT

Fundamentals of Tourism Tourist Behavior Tourism Management Tourism Marketing Event and Destination Marketing Interactive and Web Marketing in Tourism

Email: studyabroad@sfsu.edu

Website: oip.sfsu.edu/studyabroad

The French government allocates a considerable number of grants to foreig n students every year. For more information visit: http://www.ambafrance-us.org Visit our Scholarship page on our website: http://www.sfsu.edu/~studyabr/ScholarshipsAnd Financing/ScholarshipsAndFinancing.html

Housing Visit SKEMA’s website and click on the “Practical Information” section: http://www.skema.edu Stduents on exchange programs at SKEMA tend to live in off-campus apar tments, whether alone or with other international or French students.


CANADA

GERMANY

Concordia University

Fachhochschule Fulda

Requirements

Programs Offered

Dates & Deadlines

Requirements

Programs Offered

Dates & Deadlines

• 60 units or more completed by

• Courses in most majors

• Academic Calendar

• 60 units or more completed by

• Social Work (fall only)

• Academic Calendar

Fall Semester: September - December

departure

Spring Semester: January - April

• 3.0 GPA

• Application Deadlines

• Language of Instruction: English

For Spring Semester:

September 15th

• Semester or year options available

For Fall and Academic Year:

March 1st

Montreal, Quebec, Canada Montreal, the second largest French-sp eaking cit y in the world is lo cated on an island in the hear t of the St. Lawrence Valley. It dates back to the 17th centur y and is built around a mountain the center of the island known a s Mont-Royal. The cit y is within an hour’s drive of a myriad of lakes and ski resor ts in the Laurentian mountains and the Ea stern Townships. Few cities are a s exciting and multi-dimensional a s Montreal. As one of the great cities of the world, it boa sts an Olympi c stadium, a famous ho ckey team, world cla ss ar t galleries, an excellent metro system and some of the finest shops this side of the Atlanti c. Montreal is a major financial, business, and industrial center of higher learning and an attractive cit y for major research oriented companies. Student Ex p erience Rep or t: http://www.sfsu.edu/~studyabr/Ex p erienceRep or ts/CanadaConcordia04.pdf

Concordia University Concordia is a dynami c first choi ce for globally minded students who wish to acquire a first-cla ss education. Concordia offers a wide range of innovative programs that provide a uni que and challenging educational ex p erience. We offer students a chance to study in an institution that keeps its cla sses small, its professors accessible, and its education affordable. Concordia ha s four faculties and a Scho ol of Graduate Studies, a s well a s numerous colleges, centers, and in stitutes. Visit the website: http://www.concordia.ca

l Montrceonad

se has the f restaurants ro numbe orth ita in N p per ca after st u (j a c Ameri YUM! rk City). New Yo

Fall Semester: September - December

departure • 3.0 GPA & appropriate

• Application Deadlines

prerequisites

For Fall Term:

March 1st

• Language of Instruction: English • Prior college-level German recom- mended, but not required

Fulda, Germany

Fachhochschule Fulda

The Baroque cit y of Fulda is lo cated between the Rhon and Vogelsberg mountain s in the green geographi c center of Germany. The region is home to numerous mechani cal, electri cal and computer engineering companies and servi ce firms. The histori c cit y of Fulda attracts visitors from around the world. A cit y of 63,0 0 0 in habitants, Fulda boa sts one of Germany’s most pi cturesque and charming old town s. Fulda, situatied in the center of Germany, enjoys ideal tran sp or t connection s. The cit y is lo cated along a highway and is served by ICE (Intercit y Ex press), Germany’s high-sp eed train system. Germany’s principal international airp or t, Frankfur t, is just an hour away by car or train.

With about 4,50 0 students, Fulda maintain s a great student to facult y ratio. The campus is medium-sized and ver y attractive a s well a s ver y accessible by publi c tran sp or tation. Fulda offers programs in Multimedia Technology, Electroni c Business Systems and Appli cations, Information Securit y and Electroni c Payment Systems, and So cial Work. The program will a ssessed through comparative evaluation of student projects, p ost-exchange interviews, and reviews by Fulda and SF State facult y. Visit the website: http://www.fh-fulda.de/

Fulda reat

was a g hub of al and mediev , culture learning s abbots were It . n religio oly of the H princes mpire. E n a m Ro


prospectus

28

Megan Pettley


Opening Spread is a colorful, lively welcome to students interested in studying abroad.


30

Megan Pettley


Destinations

28+ 6 { Regions

Countries with programs and growing!

8{

Asia Africa Europe Australia North America South America

Language Programs

Spain Mexico France Germany China Taiwan Korea Italy

Students

400 { Students per year

65% 44%

non-traditional students

35% Male

first generation students

65% Female

95% of qualified applicants receive a nomination

Field of Study

summer

80 + 64 = 144

7% 63% year

30%

semester

Program Duration

CSU IP

Direct Exchange

Partnerships with SF State Abroad

9


Ocean Beach as Artifact Atlas / Book Design / Data Visualization This atlas is an exploration of the ephemerality of the tides at Ocean Beach in San Francisco. There’s a constant shift as to what we see as we walk on the beach, from bits of seaweed and random pebbles to half-broken sand dollars and remnants of shells. As such, I chose to record found sand dollars that are between Fulton Street and Lincoln Avenue. I recorded during high and low tides for two days, walking along the edge of the waves and keeping close track of the sand dollars, marking location and level of completeness.

Skills Used Adobe Illustrator Adobe Photoshop Adobe Acrobat Pro Photography

32

Megan Pettley


mood board

34

Megan Pettley


sketches / ideation


recording methods

Each time I recorded the number of sand dollars I first started by walking to the Cliff House, which has an aerial view of Ocean Beach. This was done to get a visual on the tides during that particular recording time. These aerial photos gave me a physical, visual representation of how the tides change and a way to create a visual language and pattern from these changing tides.

36

Megan Pettley


Recorded location and size of the sand dollars based on a size scale from one to five, one being a small piece and five being a whole sand dollar.


final atlas

38

Megan Pettley


40

Megan Pettley


Opening chapter spread sets the scene for the data with the day, tide cycle and traced tide visualization from the aerial photo taken before recording.


The chapter introduction continues to set the scene with a description of the atmosphere during the recording.

42

Megan Pettley


Data visualizations of the sand dollars found and their level of completeness.


44

Megan Pettley


46

Megan Pettley


Foghorn

User Interface Design Foghorn is a quirky travel companion for those wanting to explore San Francisco. The app promotes discovery over sightseeing and serendipity over itinerary. With these ideas in mind, Foghorn helps users acquaint themselves with the city through local slang dictionaries, fun facts, and unique activity ideas. In addition, users can write and record their adventures and view them through detailed map visualizations.

Skills Used Adobe Illustrator Adobe Photoshop Adobe Acrobat Pro

48

Megan Pettley


avoids any unnecessary discouragement from the application.

design audit

Location tracking, geo-tagging and travel logging audit of 20

similar to Foghorn. obilyTrip alsoapplications generates variouswith maps for its usersfeatures and their various trips. These aps and journals can be shared with other users to collaborate plan more trips based n everyone’s previous experience documented through the application. These teractions can be private with trusted contacts, semi-public through Facebook and her outlets, or public through the application’s social media sphere.

Travelog Trip JournalTrip Journal

Travelog

Travelog is an application much like a travel Travelog is an application much like a travel Trip Journal is another application designed Trip Journal is another application designed journal that allows users to record their travel journal that allows users to record their travel as a helpful trip companion during user’s as a the helpful trip companion during the user’s moments through photos and pinning their moments through photos and pinning their vacation. The application offers a regular vacation. The application offers a regular a Lite map.version Users for can also discovadventures on a map. Users can also discovprice of $2.99 or offers a free Lite version foradventures price of $2.99 or offers a on free er limited “hidden sights” through er “hidden sights” through other travelers Android that is limited to one trip. The design Android that is to one trip. The designother travelers using the same using the same application. There are is simple, including options for new trips, is simple, including options for application. new trips, There are and news from travelers all ongoing trips, an archive of trips, and iTunes up-to-date stories and news from travelers all ongoing trips,up-to-date an archivestories of trips, and iTunes world. can be imports. In addition, a pinned map is used toaround a the around the world. Experiences can be imports. In addition, pinned map isExperiences used to shared Facebook with and Twitter, and see all of the user’s visited locations, shared through Facebook and Twitter, and see all ofwith the user’sthrough visited locations, be transferred into blog photos organized and allocated andjournal entries journal entries can be transferred into blog photos organized and can allocated and geo-tagged to the respective locations.posts. geo-tagged to the respective locations. posts. Notes and video are also included. The appliNotes and video are also included. The application also provides multiple sharing While this application excellent at travel cation options also provides multiple sharing is options While this application is excellent at travel including Facebook, Twitter,including email, and logging, many its features Facebook, Twitter,of email, and are Internet logging, many of its features are Internet Google Earth. Google Earth.based, using GPS and Wi-Fi components. based, using GPS and Wi-Fi components. This does not mean that users cannot save This does not mean that users cannot save Various problems with the application Variousinclude problems the application their with information for theinclude next time they have their information for the next time they have the occassional glitch and confusing maneu-Internet the occassional glitchaccess, and confusing maneuhowever. Internet access, however. TheMobilyTrip’s cover of the application These are theoffour sections in verabily and usability. These problems mayusability. These This is an example ofsections thescreenshot The user cover the application These are the four in various Not only does this appliverabily and problems may can share their This is an example ofUsers the This further Not only does this appliresembles that of a travel journal which the application isemulates maps used resembles thatcation of a travel journal which the of application isin this Trip Journal that ashows real Travelog has atheminimalist design maps used in this weaken the application, causing potential allow users togeo-tagged experiences through examples ofgeo-tagged trip cation allow users to with weaken the application, causing potential book, important for conveying to divided and organized. The application. screenshot book, important for conveying to divided andThis organized. Thein interfaces are both simple application. This screenshot in users to switch to other available “travel com- to other available record their trips, Travelog application itself, blogs, ideas and opportunities users the use and function of the record their trips,can Travelog design is diary, clean andfunction simple, users to switch “travel comparticular route informausers the use and of the design isshows clean and simple, travel providing users with geowith a simple UI as well. Users docparticular shows route informaapplication. driven to aid usability also has suggested tion trips panions” with a simpler system.panions” with a simpler system. Facebook, or Twitter. and to tracking for the userthrough in offered Travelog. also has suggested trips application. driven aid usability tion and tracking for the user in and minimalist in design to throughout the application. Paris, France.thethrough and advice for users. throughout application. tagged maps of their journies a

However, critics have allow easy manuevering. commented on the lack easy to use UI.of organization and overwhelmSimplicity is key for an app ing factors in the amount of and options that demands the information userwithto provided this application. routinely imput information Schemer is a free application available from Momento isis an an iPhone iPhone application application geared geared Momento Android devices. Although this an application is while they towards journalenjoy writing. ItIt allows allows users toto journal writing. stilltowards in production, its concept is users a make entries using either text photos. make entries using text orortophotos. otherwise relaxing vacation. This application is aneither crowd-sourced travel guide. Google aims Users canalso also tag themselves withpeople people can tag themselves with tracker, which tapUsers into aactivity travel guide supported by experiIttravelers provides and from their address book, andadd add locations is displayed viamotivation the from their address book, and locations enced already in that area. Visitors left Whilelistisis from thescreenshot. GPS. Whatever captured canalso also canfrom add activities toWhatever a to-do and check off the GPS. captured can avoids any unnecessary this does and not necesas be they progress explore location. be synced synced with eventstheir from various social social with events from various sarily display the discouragement from the media services includingthose thosefrom fromTwitter, Twitter, media services including travelling compoAlthough still being developed, Schemer isany aany web application. Facebook, and Flickr—essentially web Facebook, and Flickr—essentially nent, it does indeed

Schemer Momento Momento

hemer

ication available from ugh this application is its concept is a uide. Google aims to supported by experiy in that area. Visitors o-do list and check off xplore their location.

eloped, Schemer is a anting to kill several a whole day. Regardable, the application cal and experienced s and advice. The s not fully developed, be inserted into the MobilyTrip has a MobilyTrip ation tracking.

However, critics have commented on the lack of organization and overwhelming factors in the amount of information and options provided with this application.

Paris, France.

ument their experiences through phoand advice for users. tos, captions and geo-tagging. News and stories from travelers are also included.

This application is an activity tracker, which is displayed via the left screenshot. While this does not necessarily display the travelling component, it does indeed show the application’s user tracking concept.

great idea forthe those wanting to kill based service that provides anseveral RSSororATOM ATOM show applicabased service that provides an RSS hours or those planning a whole day. Regarduser tracking feed.tion’s Another important measure measure it’s it’s the the feed. Another important less of the user’s timetable, the application concept. ability to export data and applications applications ability to export data and provides access to local and experienced backupsuggestions thedata. data. and advice. The backup the travellers’ quantified self aspect is not fully developed, This application would fallunder under the quantibutThis could potentiallywould be inserted into the the quantiapplication fall The lower right screenshot Theabove abovescreenshots screenshotsreflect reflectthe theapplication’s application’s lifelogging features The lower right screenshot The lifelogging features simple UI and clean is acan crowdvarious sourced travel guide Momento isare geared towards journal shows the timeline organizathrough timeline-likeorganization organizationand and structure. Events are also application through location tracking. shows the timeline organizathrough it’sit’stimeline-like structure. Events also fiedself’s self’s lifelogging component. Users can fied lifelogging also generates various maps forcomponent. itsSchemer usersUsers and their trips. These

The logo iselevated both playful and tion the application. This loggedasasmoments, moments,totogive givea amore moreadventurous, adventurous, elevated sense tion ofof the application. This is is logged sense ofof advenlogo is both playful andin advengraphics. Users document trip that has experienced travellers writing and allows users to add text, essentially logtheir theirThe daily activities, which in essentially log daily activities, a daily log a user, which the user’suse useofoftime. time.The Thewording wordingis iskey key the functionality and a daily log of of a user, which the user’s forfor the functionality and turousimportant in conveying not maps andcan journals cantheir be shared with other users toinwhich collaborate plan moresupplytrips based turousimportant conveying not turn can provide them with raw data needed turn can provide them with raw data needed includes text and pictures to user experience of the application. includes text and pictures to user experience of the application. only the application’s purpose, but and share their travel journals to the ing the data. Visitors to an area can add photos and GPS location. Cansense be synced only the application’s purpose, but give overall give anan overall sense of of thethe on everyone’s previous experience through the application. These examinedocumented their activities activities and use ofof time time toto examine their and use to entice and encourage new users to entice and encourage new users Internet and Facebook. activities to a to-do list. The design is tojoinsocial media sites and events posted. to the “scheming”. over an an extended period time. However, extended period ofof“scheming”. time. However, to join the interactions can be private over with trusted contacts, semi-public through Facebook and there isisno nosummary summaryororconclusive conclusive analysis playful and the UI is clean are concise. a to-do list. It is a lifelogging app. there analysis

other outlets, or public through theby application’s social media provided by theapp, app,which whichinin turnfails fails QS’s sphere. provided the turn QS’s ideaofof“self-knowledge” “self-knowledge”from fromthis thisself-trackself-trackidea ing. ing.

50

Megan Pettley

This scree shows ex ideas and offered th


sketches / ideation


icon development

DESTINATION

SFO SAN FRANCISCO

148934

52

Megan Pettley DESTINATION


wireframes

title

w el c o m e m e s s a g e

sub information / text

binoculars

section 1

jo ur na l

section 2

s ui t c a s e

Home Screen

section 3

Subsection Menu

Visualized Map


begin an adventure!

b i n o c u la r s

sign-in

journal

sign-up

s u it c a s e

1. Welcome

54

Megan Pettley

2. Home Screen

Three Sections for users to navigate, chosen by sliding to the right, as indicated by the arrow

Recount experiences through posts, photos, and geo-tagging.

View trip summaries through data and map visualizations.


slang diction a r y

t i p s & t r ic k s

User-generated Section, provides travel tips and “secret spots” in San Francisco to find

qu i r ky f a c ts s l a n g dic tion a r y

h ip• s t er n o un , ad jecti v e

Facts and Slang are featured, in order to fill user in on local culture

An urban dweller who goes to all the coolest clubs, listens to the coolest music, is into various aspects of the arts, including but no limited to: street art, indie films, and sticker art. A hipster also must know all the coolest hipsters. If you have to ask what a hipster is, then you are definitely not a hipster.

Small Icons allow users to navigate main sections of application with a simple touch

3. Binoculars

4. Slang Dictionary

Definitions help the user interact with the local culture in a fun, informative manner


not e s

User can write, share and review visited places

p h ot os

Photos can be taken and added to written notes and pinned / geo-tagged locations

p in s

5. Journal

56

Megan Pettley

num bers pathways street sm ar t s

6. Suitcase

Quantified-self Section, based on geo-tagged locations this section generates several map visualizations. Point system derived from this amount also ranks users from tourist to local.

Listings of locations, number of places visited in neighborhoods and amount of miles walked

In Street Smarts Section users are ranked from tourist to local


p a th wa y s day

Visualized Trip Summaries for each day show user’s path, pinned locations, and visited districts

S a n F r a n c is c o , 2 016

123456789 10 10,524 steps 3 miles

Modified icons for visual heirarchy

7. Pathways

Personalized Stickers are available as a souvenir for users who visit at least 8 districts. Given one small and large sticker for free


Paradise Lost Type Specimen

This type specimen was inspired by Park Merced, an idealized pseudo-suburban sprawl on the edge of San Francisco. When developing the type specimen, I took particular notice of the many objects throughout the neighborhood that were dilapidated and tarnished, including peeling paint, molded welcome mats, cracked sidewalks and rusted windowsills. As such, this is a distressed, post apocalyptic type specimen for the creepy, the strange and the rebellious.

Skills Used Adobe Illustrator Adobe InDesign Adobe Photoshop Glyphs App

58

Megan Pettley

Q


Q


WELC 60

Megan Pettley


COME

TO PARADISE LOST.


photo documentation

62

Megan Pettley


sketches / iterations

64

Megan Pettley


The letterforms are simliar with the faded, disconnected lines. Variations in the overall shapes and angles are created by using the white space.


AB CDE GHIJKLM NOPQRSTU VWXYZ 66

Megan Pettley


0123 456 789 . , !? “ ”


UJ U J The structural base is Times New Roman due to its iconic, classic appeal and familiarity in order to further the dystopic, tarnished look and sense of unease.

68

Megan Pettley


V R RV Disconnected lines, a sense of incompleteness, or something unresolved.

Pieces of the letterform appear to be eaten away.


70

Megan Pettley


72

Megan Pettley


Exposing Justice Ida B. Wells Special Edition

Ida B. Wells was one of the first African American female investigative journalists in the United States. From the mid 1880s to 1920s she dedicated her life to documenting and speaking out against lynching in the South, touring across the United States many times and twice in England. Wells wrote hundreds of articles on lynching which included statistics she and other fellow investigators recorded themselves. This Special Edition Box Set is designed for a commemorative event for Ida B. Wells. Deliverables include a 100+ page biographical book, an event poster, a DVD and case to promote the event, and a vessel to contain all deliverables.

Skills Used Adobe Adobe Adobe Adobe

74

InDesign Photoshop Illustrator Acrobat Pro

Megan Pettley


sketches

76

Megan Pettley


branding elements

Courier Bold

Avenir Book

abcdefghijklmnopqrstuvwxyz

abcdefghijklmnopqrstuvwxyz

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

1234567890!?*&@

1234567890!?*&@


poster iterations lib

ert

lib

ert

y

move unveil truth lib ert y

exposure. exposure. exposure. exposure. exposure. exposure. exposure. exposure. exposure. Commemorating the revolutionary work of Ida B. Wells Sunday, May 17th Location TBD www.idabwells.com

justi

ce

y

move announce unveil feel uth replace tr truth shoot

publishing redefine justice. raw commemorating the revolutionary work of Ida B. Wells Sunday, May 17th Location TBD www.idabwells.com

feel ge emer announce

lib m ert ove y record naked truthreach unmask truth think feel publish declare e mov g r e e naked em raw redefine announce uth unveil shoot trh replace c a e conceal r think feeltruth truth redefine declare raw geinequality naked emer feel move unveil full disclo sure raw grow record vigi justice lence ch a e naked r k uth unmask tr truth thin declare feel unveil publish e g r naked eme move redefine shoot rawunveil uth trannounce replace conceal hh ac ut re tr k feel redefine thinraw ltruth ibe declare inequality r l ge iber ty r e m naked e ty conceal full disclosure justice

exposing justice.

Commemorating the revolutionary work of Ida B. Wells Sunday, May 17th African American Arts & Culture Complex www.rememberingida.aaacc.com

exposing justice. Remembering the work of crusader Ida B. Wells

Sunday, May 17th African American Arts & Culture Complex www.rememberingida.aaacc.com

emb em

of

cr

B.

We

s ll

g in er

17 ay

Sunday, May 17th African American Arts & Culture Complex www.rememberingida.aaacc.com

er ingi da.aaacc.com

Af r i c a

n A m

er

ic

w

Megan Pettley

rk wo

a

th

Commemorating the revolutionary work of Ida B. Wells

78

th

Id

e

exposing justice.

er

R

osing tice.

ad us

b em em .r ww

a n A rts & C u lt ur

e C o mp l e x

Sun

y, da

M

e mb me Re

ng ri

e th

wo

rk

of

u cr

r de sa

Id

a

B.

We

s ll


final poster

Poster contains clippings from Wells’ articles referring to crime, lynching and segregation.


other deliverables

Newspaper contains two articles written by Wells, including statistics she recorded herself, and images.

80

Megan Pettley

Book Cover is inspired by poster design with pink opaque overlay. Wells printed her newspapers on pink paper so the blind could ask for the pink paper and have it read to them.

DVD Cover is also inspired by the poster design, fingerprints represent an erasure of identity, and are meant to create a sense of crime and disfunction.


Vessel is a canvas messenger bag due to its reference to newspapers and jouranlism.


82

Megan Pettley


84

Megan Pettley


Each opening chapter spread has a quote by Wells and an image that refers to the chapter’s content.


Fingerprints increase throughout each chapter’s spreads, slowly disrupting the text to expose the audience to the crime and violence of lynching and the lives lost.

86

Megan Pettley


Each ending chapter spread is a number from one of the five years Wells kept detailed records of the number of lynchings in the South.


88

Megan Pettley


Thank you,

meganpettley.com

I look forward to working with you! meganpettley.com (831) 682 - 5603 mpettley@gmail.com www.linkedin.com/in/mpettley www.behance.net/meganpettley

90

Megan Pettley


92

Megan Pettley


Graphic Design Portfolio