Designing

for Designers

Creating a website to showcase our graphic design class required exceptional attention to detail—the platform needed to both promote our exhibition and serve as a portfolio launchpad for forty-seven unique designers. We aimed to balance sophisticated aesthetics with functionality, creating a digital experience that complemented our physical exhibition while giving each designer the chance to meet their next employer.

Project

Details

Project

Details

Project

Details

Duration

15 weeks

Duration

15 weeks

Duration

15 weeks

Duration

15 weeks

Contributors

Gergo Fusti-Molnar
(Web Committee Chair)

Meraki Web Committee

Meraki Branding Committee

Contributors

Gergo Fusti-Molnar
(Web Committee Chair)

Meraki Web Committee

Meraki Branding Committee

Contributors

Gergo Fusti-Molnar
(Web Committee Chair)

Meraki Web Committee

Meraki Branding Committee

Contributors

Gergo Fusti-Molnar
(Web Committee Chair)

Meraki Web Committee

Meraki Branding Committee

Areas

User Experience
User Interface
Branding

Areas

User Experience
User Interface
Branding

Areas

User Experience
User Interface
Branding

Areas

User Experience
User Interface
Branding

Project

Deliverables

Project

Deliverables

Project

Deliverables

A responsive website that promotes and gives details for our exhibition event along with being a centralized way to access the portfolios of all graduating designers. The site must extend and compliment the event branding and the content being produced by other committees.

Previous

Years

Previous

Years

Self-Made

Fall 2024

Opportunities for Improvement

No event information

Frequent page jumps

Static with limited motion

Slow loading speed

Shifting Perspectives
Spring 2024

Opportunities for Improvement

No event information

Extraneous navigation

Static grid layout

In Focus
Spring 2022

Opportunities for Improvement

Overused animation

Unclear navigation

Type needs more heirarchy

Design

Pillars

Design

Pillars

Make it

Creative

Do something different, highlight everyone’s work

Make it

Engaging

Incorporate motion, micro interactions

Make it

Actionable

Calls to action, convert viewers into employers

Initial

Inspiration

Initial

Inspiration

Low

Fidelity

Low

Fidelity

Key

Feedback

Key

Feedback

1

Small page count, no unnecessary fluff. Condense information into fewer sections

2

Highlight various disciplines with minimal friction

3

Prioritize mobile and responsive design for best accessibility

User

Personas

User

Personas

Alexis Mercer

Alexis

Mercer

Age

Location

Occupation

Education

Age

Location

Occupation

Education

36

Austin, TX

Creative Director

MFA in Graphic Design

36

Austin, TX

Creative Director

MFA in Graphic Design

Overview

Overview

Alexis has been working in the design industry for 14 years and has been in a hiring position for the past 5 years. She oversees a team of 12 designers and is responsible for bringing in new talent. She's constantly looking for fresh perspectives that can enhance her team's creative output.

Behaviors and Preferences

Behaviors and Preferences

  • Regularly attends graduate exhibitions to scout emerging talent

  • Spends approximately 30-45 seconds reviewing each portfolio initially

  • Checks portfolio websites on both desktop and mobile devices

  • Often browses portfolios during commutes or between meetings

Goals and Motivations

Goals and Motivations

Alexis' aim is to efficiently evaluate numerous portfolios to identify standout talent, build lasting relationships with educational institutions for ongoing recruitment, and stay current with emerging design trends and techniques that could benefit her agency's work.

Pain Points

Pain Points

  • Limited time to review large numbers of portfolios

  • Frustration with poorly organized or slow-loading portfolio sites

  • Often encounters impressive visuals but poor navigation or information architecture

Quote

Quote

"I'm not just looking for beautiful work. I need to see designers who understand that their solutions must solve real business problems."

Site

Mapping

Site

Mapping

Refining

Phase

After gaining valuable feedback from our class, our next task was to transform the critique we got into actionable improvements, refining the site to better engage our target audience.

After gaining valuable feedback from our class, our next task was to transform the critique we got into actionable improvements, refining the site to better engage our target audience.

Revised

Wireframes

Revision

Feedback

Revision

Feedback

1

Focus on density, include as many people on the screen at a time as possible

2

Go in a cleaner direction with the visuals, sharp corners and largely monochrome

3

Balance length of hero animation to engage but not deter by way of delaying information

Comps

Our

Solution

Designers,
Front and Center

Designers,
Front and Center

Designers,
Front and Center

A simple, but engaging grid of designers on the home page helps employers to sort through the masses, avoiding information overload while getting a glimpse at each designer's unique skills.

A simple, but engaging grid of designers on the home page helps employers to sort through the masses, avoiding information overload while getting a glimpse at each designer's unique skills.

An Event for

Everyone

An Event for

Everyone

An Event for

Everyone

An inviting card provides easy access to information sought by any eventgoers and those interested in attending. Calendar and maps integrations make planning a breeze.

Find Who You Need

Find Who You Need

Find Who You Need

With so many designers to choose from, finding one with the right set of skills can be difficult. A set of engaging, animated filter buttons makes searching simple.

All the Details

All the Details

All the Details

Once you find a designer that piques your interest, you can get a more detailed view of their specialties by hovering on their headshot.

Our Logo

Our Logo

Our Typography

Our Typography

PP Neue Montreal

Bold, Titles and Headlines

Bold, Titles and Headlines

ROBOTO MONO

Bold, Body Text

Bold, Body Text

EB Garamond

Medium, Body and Accent Text

Medium, Body and Accent Text

Our Colors

Our Colors

Fluorescent Pink

FF48B0

0,72,31,0

White

FFFFFF

0,0,0,0

Black

000000

0,0,0,100

Our Imagery

Our Imagery

Our Icons

Our Icons

Problems

Solved

Created a platform to showcase graduating designers' work to industry professionals who might not attend the physical exhibition

Extended the exhibition beyond its physical location and limited duration, allowing access to everyone

Implemented filtering functionality to help visitors find designers that match specific criteria or specializations

Created a permanent digital record of the exhibition and student work for future reference