UX/UI Design      visual DESIGN      web development

Rebuilding a Seattle Band‘s Brand

The Problem

Google analytics for the Furniture Girls website indicated that an increasing percentage of the band’s visitors were visiting the site via tablet and mobile devices, but a large percentage of those mobile and tablet users (88%) were leaving the site without ever interacting with the band’s content.

 

My Solution

With that in mind, a primary goal in redesigning the Furniture Girls website was to update the fixed-width content and static HTML layout to a fully responsive design.

 

I began by creating wireframes for each page layout at three breakpoints: mobile (320px), tablet (768px) and desktop (960px). After determining how elements on each page would respond to different viewports, I began replacing each of the existing PNG image assets with scalable vector graphics (created in Adobe Illustrator). I finished the design and development phase in Adobe Muse, adding three additional breakpoints during the development phase to support additional viewport widths.

 

Since the launch of the new site in Spring 2016, analytics show that bounce rate on mobile and tablet devices has dropped by over 30%, while average session duration has nearly tripled.

UX Design      visual DESIGN      interaction design

Rebranding “The First Social Network”

In 2012, I was hired by the Memory Lane creative services team to assist with a comprehensive rebranding project that would return the company to its origins, as social networking site Classmates.com. In addition to working with the team to develop the new brand, I was tasked with applying the new visual style to site designs for desktop and mobile; I helped create a cohesive system for navigating user-generated content on profile pages, class lists and member locations, as well as custom controls and menu systems for settings and second-tier content. I worked closely with product management to deliver detailed visual specs and design direction to the development team.

 

Another project I worked on was a mobile-optimized Facebook app built on member data from its schoolFeed sub-brand. The app, called “Friends Back Then,” was one that allowed Facebook users to view high school photos of their Facebook friends. I was responsible for refining feature outlines and user stories assembled by product managers, and for creating high-fidelity visual designs (using on the iOS GUI) and creating a variety of scenario-based comps for user research studies.

MOBILE App Concept      UX/UI DEsign      Interaction Design      Visual Design

A Better Way for Bands to Reach Fans

The Problem

Indie artists and bands have to use multiple platforms – typically 10 or more – to engage with their fans. As a result, every content update the artist needs to make (i.e. adding new music, new shows, etc.) has to be made separately, on each platform – 10 or more times!

 

My Solution

Design an app that connects to all of these platforms, allowing artists to store all their content in one place – either in the app, or wherever they want – so they can update all of their fan sites at the same time.

 

  • This prototype shows how an artist could use the app to release a new song to 10 different streaming platforms at once.

product Envisioning      UX/UI Design      Interaction Design      Visual Design      Prototyping

Connecting Employees to Their Staffing Agency

The Problem

Terra Staffing Group is a placement agency that employs dozens of on-site contractors in an array of industries. They needed a mobile app that offered a simple, direct way to connect with their placed employees in the field, and to help others find work.

 

My Solution

Our design team worked with the client to envision who the app's users would be, and how it might function. Through a hands-on workshop, we designed an MVP with three primary features: job search, payroll and contacting HR.

 

  • I created this clickthrough of the final design to present to the client. It illustrates the functionality, design and layout of the MVP version of the app.

Visual Design

All original artwork ©2020 J. Watkins. All rights reserved.