erin d. lillyerindlilly.com/static/erin-d-lilly-design-portfolio.pdf · michigan gop / state budget...

14
Erin D. Lilly research & design ~ writing sample portfolio

Upload: haliem

Post on 11-May-2019

216 views

Category:

Documents


0 download

TRANSCRIPT

Erin D. Lillyresearch & design ~ writing

sample portfolio

EducationNews Community History

Introduction

University of Michigan

Aquinas College

Experience

MS Information TechnologyDecember 2017

GPA: 3.7

BA English, Cum LaudeMay 2013GPA: 3.5

user interviews personas scenarios heuristic analysis wireframing

digital and paper prototyping branding visual identity print design web design

python html cssphotoshop illustrator indesign

I’m a recent graduate of the human-computer interaction program at

the University of Michigan with knowledge in user experience research and design.

Education

Skills

• Conducted a heuristic analysis of the company’s current website to identify weak points in preparation for a full redesign.

• Designed web and social media graphics to represent the station’s various brands and events.• Organized a visual identity package that would represent the company through on-air, digital and internal

communications.

• Analyzed the personal accounts of employees and identified weak points in company organization and information sharing between team members and clients.

• Composed a plan to improve production line with a heavy focus on education and cross-departmental communication.

User Experience ConsultantMichigan Legal Help, August - December 2016

• Composed and conducted interviews with stakeholders and potential users.• Organized, drafted and launched survey to measure the user behavior and satisfaction.• Performed extensive usability tests with potential users to highlight issues in the organization's website.

User Experience ConsultantEdwards Brothers Malloy, August - December 2016

User Experience / Design InternDetroit Public Television, September - December 2017

• Coordinated the content and production of member magazine across various departments, creating content, providing design feedback and performing edits as needed.

• Drafted updated designs for the station’s main website and secondary brands and intiatives for both Wordpress and PBS content management systems.

Communication Specialist - User Experience ConsultantDetroit Public Television, January - April 2018

Projects

Erin D. Lillyresearch & design ~ writing

Web & Mobile Design

As Detroit Public Television prepared for a large-scale website redesign, one of my first projects with them involved a potential overhaul of the blogs connected to their two main news and public affairs programs: MiWeek and American Black Journal.

While the framework they were planning to upgrade to greatly simplifies the website building process, it presents an interesting challenge where indivdual components act as pieces to a puzzle that you create as you design. With the similarities between the two programs and the fact that these spaces had to fit into the overall Detroit Public Television site, I aimed to create pages that could present the same type of information, but still be tailored to the programs’ unique visual styles and requirements.

Detroit Public Television’sMiWeek /American Black JournalMain Pages

Web Design

Home Schedule Videos Programs About Support Education Kids

Nicolai VittiLoves a ChallengeNicolai VittiLoves a ChallengeVitti, who grew up in Dearborn Heights, has spent months discussing his vision in broad terms. But Detroi-ters say they want specifics.

Vitti, who grew up in Dearborn Heights, has spent months discussing his vision in broad terms. But Detroi-ters say they want specifics.

Michigan GOP / State Budget Report / Cass Tech Drama Students

Michigan Republicans are gathering for their leadership conference on Mackinac Island over the weekend. The MiWeek team debates the future of the state GOP party.

Read More >>Read More >>

Watch LiveThursdays 7:30pm ET

Web ExclusivesEpisodes About the Show

56.1 DPTV-HD

Thursdays 7:30pm ET

Fridays 5:30am ET

Sundays 9am ET

56.4 DPTV WORLD Channel

Saturdays 6pm ET

Sundays 5:30p ET

SEP

20Last Updated by MiWeek Editor on Sep 22, 2017 at 8:09 am

Latest News

Read More

Michigan GOP / State Budget Report / Cass Tech Drama Students

Michigan Republicans are gathering for their leadership conference on Mackinac Island over the weekend. The MiWeek team debates the future of the state GOP party.

SEP

20Last Updated by MiWeek Editor on Sep 22, 2017 at 8:09 am

Read More

Michigan GOP / State Budget Report / Cass Tech Drama Students

Michigan Republicans are gathering for their leadership conference on Mackinac Island over the weekend. The MiWeek team debates the future of the state GOP party.

SEP

20Last Updated by MiWeek Editor on Sep 22, 2017 at 8:09 am

Read More

1 2 3 ... 101 older posts

Connect with MiWeek

Broadcast Information

Meet the Contributors

Stephen Henderson Christy McDonald Nolan Finley

Stephen Henderson is the Pulitzer Prize winning Editorial Page Editor of The Detroit Free Press and host of American Black Journal. A Detroit native, Henderson is a graduate of University of Detroit Jesuit High School and the University of Michigan. He has worked previously as a reporter, editorial writer and editor at the Baltimore Sun, the Chicago Tribune and the Washington bureau.

Stephen Henderson

Read More

More Links:

Dr. Nikolai Vitti / Maria's Story > Cass Tech Drama Students >

MiWeek is sponsored by:

Stephen Henderson is the host of American Black Journal and editorial page editor of the Detroit Free Press. A Detroit native, Henderson is a graduate of University of Detroit Jesuit High School and the University of Michigan. He has worked previously as a reporter, editorial writer and editor at the Baltimore Sun, the Chicago Tribune, and the Knight Ridder

Home Schedule Videos Programs About Support Education Kids

One DetroitEducation RoadshowOne DetroitEducation RoadshowHosts Stephen Henderson and Christy McDonald explore the topic of education in Detroit during this special.

Hosts Stephen Henderson and Christy McDonald explore the topic of education in Detroit during this special.

Read More >>Read More >>

Episodes Watch Video Show History

Funded by:

Connect with American Black Journal

Sign up for the newsletter

email address

Subscribe

56.1 DPTV-HD

Sundays 9:30 a.m. ET

Wednesdays 7:30 p.m. ET

56.4 DPTV WORLD Channel

Saturdays 5:30 p.m. ET

Sundays 6:30 p.m. ET

Broadcast Information

Michigan GOP / State Budget Report / Cass Tech Drama Students

Michigan Republicans are gathering for their leadership conference on Mackinac Island over the weekend. The MiWeek team debates the future of the state GOP party.

SEP

20Last Updated by American Black Journal Editor on Sep 22, 2017 at 8:09 am

Latest News

Read More

Michigan GOP / State Budget Report / Cass Tech Drama Students

Michigan Republicans are gathering for their leadership conference on Mackinac Island over the weekend. The MiWeek team debates the future of the state GOP party.

SEP

20Last Updated by American Black Journal Editor on Sep 22, 2017 at 8:09 am

Read More

Michigan GOP / State Budget Report / Cass Tech Drama Students

Michigan Republicans are gathering for their leadership conference on Mackinac Island over the weekend. The MiWeek team debates the future of the state GOP party.

SEP

20Last Updated by American Black Jounal Editor on Sep 22, 2017 at 8:09 am

Read More

1 2 3 ... 101 older posts

About the Show

American Black Journal is a window into American history. For more than 40 years, American Black Journal has been a vibrant and provocative forum for newsmakers, celebrities and everyday people. Currently hosted by Stephen Henderson, Editorial Page Editor of the Detroit Free Press. The show features topics about arts and culture, and community issues such as politics, race, and religion.

Read more about the history of Detroit Public TV's American Black Journal.

American Black Journal is produced by Daphne Hughes. Hughes is a former News Manager and Producer/Writer at WDIV-TV and Senior Communications Specialist at Mort Crim Communications, Inc. She has produced several television programs, including a half-hour Detroit Public Television show focusing on The Skillman Foundation's "Good Schools in

After setting up potential designs for indivdual shows, I was asked to create a website that would display the content from Detroit Public Television’s major programs and initatives all in one place.

With so much content, information overload was an obvious concern. I wanted to be sure to include all of the major sections for promotion--top stories, recent videos, show specific blog rolls--while still keeping the design clean and managable for its audience.

Detroit Public Television’sOne Detroit Website

Web Design

Detroit Journalism Cooperative

Detroit Historical Museum

American Black Journal

MiWeek

Local ProgramsRelated Links

Connect

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat

©2017 Detroit Public TV | Riley Broadcast Center | 1 Clover Ct | Wixom, MI 48393 | (248) 305-3788 | [email protected]

Great Lakes Now

Detroit Performs

How Are Detroit’s Senior Citizens Doing?

Motown Mansion / Diversity & Venture Capital

Dr. Nikolai Vitti / Maria's Story

More MiWeek >

Detroit Mayoral Race / Washington Inaction, Lansing Action

Motown Mansion / Diversity & Venture Capital

How Are Detroit’s Senior Citizens Doing?

Motown Mansion / Diversity & Venture Capital

Dr. Nikolai Vitti / Maria's Story

More American Black Journal >

Green algae leads to water advisory for Maumee River

How Are Detroit’s Senior Citizens Doing?

Motown Mansion / Diversity & Venture Capital

Dr. Nikolai Vitti / Maria's Story

More Great Lakes Now >

Eisenhower Dance: On the Move

How Are Detroit’s Senior Citizens Doing?

Motown Mansion / Diversity & Venture Capital

Dr. Nikolai Vitti / Maria's Story

More Detroit Performs >

Contact

Privacy Policy

Terms of Use

LATEST NEWS

LATEST VIDEOS

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

State of Education / Cass Tech Drama Students February 1, 2016 -- by Example Lorem ipsum dolor sit amet,

consectetuer adipiscing elit, sed diam.

Dr. Nikolai Vitti / Maria’s StoryFebruary 1, 2016 -- by Example

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Michigan GOP / State Budget ReportFebruary 1, 2016 -- by Example

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Diversity & Venture CapitalFebruary 1, 2016 -- by Example

Pathways to Prison

Local Programs& Roadshows Immigration Neighborhoods

Hatred in America

Home News Videos About

One Detroit is brought to you by:

Detroit Mayoral Race / Washington Inaction,

Motown Mansion / Diversity & Venture

And viewers like you.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Motown Mansion / Diversity & Venture Capital

The Man With the Key to the Line 5 Pipeline

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Refugee Kids: One School Takes On the World

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Read More >

LATEST NEWS

State of the City / A Different Take

on Civility

February 1, 2018 -- by Example

AMERICAN BLACK JOURNAL GREAT LAKES NOW

February 1, 2018 -- by Example

DETROIT PERFORMS

February 1, 2018 -- by Example

Schedule Video Programs About Support Education Kids Donate

Dr. Nikolai Vitti / Maria's StoryFebruary 1, 2018 -- by Example

February 1, 2018 -- by Example

LATEST VIDEOS

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

State of Education / Cass Tech Drama Students February 1, 2016 -- by Example Lorem ipsum dolor sit amet,

consectetuer adipiscing elit, sed diam.

Dr. Nikolai Vitti / Maria’s StoryFebruary 1, 2016 -- by Example

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Michigan GOP / State Budget ReportFebruary 1, 2016 -- by Example

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.

Diversity & Venture CapitalFebruary 1, 2016 -- by Example

AMERICAN BLACK JOURNAL

ONE DETROIT

Pathways to Prison

Local Programs& Roadshows Immigration Neighborhoods

wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit commodo consequat molestie consequat. >> Read More

Lorem ipsum dolor sit amet, consectetuer

adipiscing elit, sed diam nonummy nibh euismod

tincidunt ut laoreet dolore magna aliquam erat

volutpat. Ut wisi enim ad minim veniam, quis

nostrud exerci tation ullamcorper suscipit lobortis

nisl ut aliquip ex ea commodo consequat. Duis

autem vel eum iriure dolor in hendrerit in vulputate

velit esse molestie consequat, vel illum dolore eu

feugiat nulla facilisis at vero eros isi.

Consectetuer Adipisci

Consectetuer Adi Adi PisciMarina SeafoodLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy

nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi

enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis

nisl ut aliquip ex ea commodo consequat.

Lorem Ipsum Dolor Sit Ametconsectetuer adipiscing 1234

123-456-7890

Consectetuer AdipisciLorem Ipsum Dolor Sit Ametconsectetuer adipiscing 1234

123-456-7890

Originally, Detroit Public Television’s digital team planned to upgrade their website to the latest version of the PBS-provided content management system framework used to build partner station pages. However, after months of researching, finalizing a basic wireframe, and building a few pages, we discovered that the current version of the website builder would not work for all of the station’s needs.

Introducing Plan B: Reworking the updated design ideas into a more complete, older version of the framework. Because of the difference in usability, many of the features that could be implemented with a click in the newer system had to be coded from scratch here, including the image and text layout used for the Channels section, the poster layout for the Local Programs and the secondary navigation for the About pages.

Detroit Public Television’sMain Website

Web Design

These mockups are the final result of a large scale project focusing on the differences between modernism and post-modernism in website design. Both examples use the same basic framework, while the principles of the two design theories are what inform the individual details.

The first website on the left focuses on clean and open design, with no excess details. The simple color palette is mainly used as an accent and to divide site sections as necessary.

The second example defies expectations with bold lines and more dynamic movement, yet still presents a layout that is easily understood and navigated.

Modernism vs Post-ModernismWeb Design Study

Web Design

Fresh PicksMarina’sOysters on the Half Shell

Lorem ipsum dolor sit amet29.99

Marina SeafoodShop Locations

Sustainable Farming Our Story

Consectetuer 29.99Consectetuer 29.99

Consectetuer 29.99

Consectetuer 29.99

Consectetuer 29.99Consectetuer 29.99

Consectetuer 29.99Consectetuer 29.99

Sustainable Farming

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt

ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci

tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum

iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla

facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit

Our Story

Marina Seafood

Shop - Sustainable Farming - Our Story - Locations

Established 1984

Shop

Consectetuer Adipisci Consectetuer Adipisci Consectetuer Adipisci Consectetuer Adipisci29.99 29.99 29.99 29.99

Consectetuer Adipisci Consectetuer Adipisci Consectetuer Adipisci Consectetuer Adipisci29.99 29.99 29.99 29.99

Sustainable Farming

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum

iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, cons ectetuer adipiscing elit, sed diam nonummy nibh suscipit lobortis nisl ut aliquip ex ea lobortis nisl ut aliquip ex ea commodo

consequat. >>Read More

Create AccountLogin Cart Checkout

The main goal of this project was to update this dream diary / meditation app with a visual design that was accessible, streamlined, but most importantly, relaxing. Interactive areas are marked with clean buttons and sleek text to keep navigation simple and direct. The pink and purple tone carried through the assets and images represent a dream-like sunset that is designed to fade into night as the user works through the process of setting up the app before bedtime.

Dream:ON App Redesign

App Design

start dreaming

wake me up at

09 45:alarm

soundscape

big ben

new york life

volume

100%

23 45:10 hrs 00 mins left

stop dreaming

categories

dream store

nightmare

fun

adventure

relaxation

100%

peaceful garden29feb

tagged friendsLuigi Mario

awake

sleep

deepsleep

Lee M. Cardholder

“Hi, stranger. It’s been a while. I’ve missed you. I feel like I can really be vulnerable around you. Do you like this tree I made? Cool, right? I thought it was cool. It’s so hard to make things sometimes, you know? It just takes so much mental energy. And I get so tired. I just want to sit here and relax with you. Wow! Check out the sunset. It’s so nice to stop and take this all in. It really makes you enjoy being alive.”

dream notes

dream diary100%

peaceful gardenA trip to the beach right inside your dreams. Watch as the birds swoop past and ride the ocean.

soundscapes

add

100%

Dream:ON

dream diary dream store

informationsettings

100%

start dreaming

Visual Identity

ID Hat Shop

ID H

at ShopFront Back

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

etsy.com/shop/IDHatShop

3’’ X 1’’Logo

For the logomark, the sun hat shape matches the client’s primary product and the smooth curves of the image are meant to give off a light yet elegant, high fashion feel. I used a darker shade for the front curve of the brim in order to add depth and strengthen the connection between logotype and logomark.

Next to the two-tone hat, I chose a thin typeface to give the pair a clean, minimalistic feel. And to complete the effect, the entire design is two shades of blue, a combination meant to be both cool and serene.

ID Hat Shop Logo Guide

Visual Identity

100,000Meaningful Statistic

50,000

1Impactful Statement

Meaningful Statistic

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis

nisl ut aliquip ex ea commodo consequat.

Ut wisi enim ad minim veniam. Lorem ipsum dolor sit amet, consectetuer adipiscing elit

We work withFuture Doctors!

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip

ex ea commodo consequat.

Ut wisi enim ad minim veniam. Lorem ipsum dolor sit amet, consectetuer adipiscing elit

In this poster and sticker set, I brought together colorful images starring young kids and a professional structure to create a design that should appeal to both children and their parents. The imagery shows the child as both a patient and “future doctor,” supporting a long term partnership with the Health System through studies, visits and potential careers.

Youth Study Promotional Material

Visual Identity

I am a

Future Doctor!

InformationVisualization

Colo

r Pr

inte

r M

apU

nive

rsity

of M

ichi

gan

Cent

ral C

ampu

s

North University

Sout

h St

ate

AH4182

CHEM1720

DANA2315

CCL1540

CCL1570

MH444

SHAPIRO1000

SHAPIROB000

GLIBN212

TAP260

SSWBB700

UNIONB620

RACK3550

ROSS00C1

ROSS10C1

ROSS10C4

DENTB344

Geddes

Was

hten

aw A

venu

e

STOCK1015

Flet

cher

East Washington

South University

COLORMULTI

POSTER

COLOR

East

Uni

vers

ity

Washtenaw

Ct.Inspired by the colors found on printer test print-outs, this map presents helpful information in a simplifed design. By keeping the layout limited to basic shapes and lines, the emphasis is placed on the most important information--printer location and type--rather than building shapes and more specific land details. The more specialized printers are marked with the brighter colors of the palette, making them more noticable, while avoiding oversaturation that might detract from the overall design.

UofM Color Printer Map

Information Visualization

Contact Me

[email protected]

phone:(313) 522-1792

email:

Detroit Journalism Cooperative

Detroit Historical Museum

American Black Journal

MiWeek

Local ProgramsRelated Links

Connect

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat

©2017 Detroit Public TV | Riley Broadcast Center | 1 Clover Ct | Wixom, MI 48393 | (248) 305-3788 | [email protected]

Great Lakes Now

Detroit Performs

Green algae leads to water advisory for Maumee River

How Are Detroit’s Senior Citizens Doing?

Motown Mansion / Diversity & Venture Capital

Dr. Nikolai Vitti / Maria's Story

More Great Lakes Now >

Eisenhower Dance: On the Move

How Are Detroit’s Senior Citizens Doing?

Motown Mansion / Diversity & Venture Capital

Dr. Nikolai Vitti / Maria's Story

More Detroit Performs >

Contact

Privacy Policy

Terms of Use