SMART CATCH
SUSTAINABLE SEAFOOD CAMPAIGN
CIRCA: 2016
ROLE
Senior Manager, User Experience
Lead UI Designer
DESIGN STATEMENT
A responsive-web project dedicated to enticing restauranteurs, professional chefs, and diners to embrace sustainable seafood alternatives.
​
I worked 1-on-1 with a talented front-end developer to realize a flexible, singular design that animates at all browser resolutions.
PLATFORM
CONTRIBUTIONS
SELECT PERSONAL
LEADERSHIP
PROJECT
STRATEGY
As the Senior Manager of User Experience, I organized all aspects of the front-end of this web site, including managing the front-end developer responsible for implementing my designs.
​
My responsibilities including coordinating discovery meetings to gather requirements, leading feature definition sessions, and overseeing scope, schedule, and budget.
INFORMATION ARCHITECTURE
SITE MAP
Early in the project, I facilitated card-sorting exercises to organize and prioritize the site. Following these meetings, I put together this site map using mind-mapping software.
​
It was delivered to the executives and primary stakeholders. Throughout the initiative, this site map was frequently referred to as a production checklist.
INFORMATION ARCHITECTURE
WIREFRAMES
The creation of rough, simple wireframes, such as this, assisted in conveying content hierarchy and text weighting.
USER EXPERIENCE
RESPONSIVE DESIGN
Using a mobile-first approach, I designed each resolution simultaneously. As each element was added, I ensured it scaled well regardless of the size of the screen.
INTERACTION DESIGN
ANIMATION REFERENCE
This entry gate was designed to offer separate experiences to chefs and the dining public.
​
I hand-keyed each frame of this animation and then worked closely with the Front-End Engineer to implement it using CSS animation
INTERACTION DESIGN
ANIMATION REFERENCE
I designed this frame-by-frame animation segment to convey two separate concepts.
First, I was tasked to keep the brand on-screen without taking up so much real estate. This was handled with the clever elimination of the illustration upon scroll.
​
Secondly, I devised a header push system that maintained a sense of place between each section.