Project 2 Proposal

katy martin. portfolio website redesign

01 intro 02 current site 05 companion elements 06 fonts & colors 07 redesign 08 inspiration

intro

For this project I would like to redesign my portfolio website. There are a lot of design elements I like about my site that I would like to keep, but the functionality of the site needs a major upgrade.

01

02

current site

This is the home page of my current portfolio website. Upon loading, a short animation takes place as the three categories take form. If the view doesn’t want to view this animation, an interruption of the mouse will cut cut the display short and go straight to the navigation screen. I like this, I feel like it gives the viewer a little bit of a ‘wow’ moment.

Right now I’m doing this effect along with a responsive full screen with Edge Animate, and would like to translate some version of this into jquery. Upon hover, I’m overall happy with the icons but may change the hover orientation. The background image is used on various elements of my brand and I am still happy with it.

03

For the layout of my current project display page, I was trying to mimick the layout of Behance. I think this is successful overall, but I do not like how the images can get cut off so you can’t view the whole project at once. Another problem is that this page is not responive so at smaller scales the logo, icons and side bar can overlap the image. I think this page could also benefit from a more intuitive home button and better transitions within the icons and page loads.

04

For pages displaying website projects I currently have an iframe connecting to the real site. Personally I like this, but am not sure it is ‘best practice’. I just wanted to utilze all the advantages to a web portfolio with the fewest clicks and richest exeperience possible. Maybe there are ways to do this without an iframe?

companion elements katymartin. us

THE FAVORITES

7 1 5 . 966 . 1750

MMME MUSI C HO

b e.n et / k_mar tin / i n / k atyma r tin 1

LAZLO MAHO

WOR K UWM UNION MARKETING

J

DCI-ARTFORM

R VEMB E ARCH I NO

FAB IO

T TEC

Glendale, WI June 2014-August 2014 Invisionship Intern 10 week retail science & design program

BLEND STUDIOS Milwaukee, WI Sept 201 1-Sept 2012 Intern/Office Assistant Edit film footage utilizing Adobe After Effects & Premiere

-Deans List at MIAD -Freshman Exhibition Winner (MIAD) -NPG.org Video Scholarship Winner

Motivated

Adaptable

LD GRA HICO PH SC

Communicative

IGNER DES IC

Fast Learner

ACCOMPLISHMENTS

IAN

MIAD Milwaukee Institute of Art & Design Interior A rchitecture Sept 2010-Dec 2011

HITE MU SIC KW AC

JAN T

UW-MILWAUKEE Peck Sch ool of the A r t s BFA in Design & Visual Communication Sept 2012-May 2015 (Intended Graduation)

Milwaukee, WI January 2014-Present Graphic Designer 1 Work with clients to translate ideas into finished designs

AGY PHO Y-N TO LG

APHER GR

SCHOOL

IAN

JOSH UA

kmartin 1 881@gmai l.com

Dependable

-Honor Roll at UWM -UWM Annual Juried Exh ibition -President of AIGA-UWM Student Group

katy martin.

A new addition I would like to make to my site is an interactive resume. I already have this designed resume and would like to keep many of its elements. I would like these elements to display dynamically upon parallax scrolling. I am also interested in somehow having an interactive business card.

05

06

nexa LIGHT ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 BOLD ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789

R 255 G 242 B 0 # fff100

R 255 G 255 B 255 # ffffff

R 0 G0 B 0 # 000000

redesign t

ABOUT ME

SKILLS

EXPERIENCE

GOALS

For the home page, I was thinking I would narrow the top portion and add the resume into a paralax scroll underneath this main navigation. When the viewer clicks on a category, I would like the logo to mimick a play button, and then have the whole page slide out to the left leading to the portfolio page. Portfolio pages will have a top navigation bar and each project will have its own banner to display the theme and name of the project. I will keep the Behance infinite scroll, but play around with the display. The project navigation will be displayed genie style on the left side rather than the bottom.

07

08

inspiration

http://www.chanified.com/ I like that this site has an opening animation (mine would not be as long) and how the resume is responding to the scrolling.

http://www.mahedineyahia.fr/ I like that this site has an opening animation (mine would not be as long) and how the resume is responding to the scrolling.

thank you!