2019

design thinkinginnovationmentorship

Facilitator

Post-its, Sharpies

Our brains

"As a seasoned designer, I want to expose more youth the possibilities of a career in design."

Hypothesis.

If we teach problem solving earlier students will be better equipped to deal with day-to-day challenges.

Goal.
Facilitate Design Thinking workshops for youth so they:

• are enable them to view difficult situations from an optimistic mindset.
• develop/increase creative confidence.
• are equipped them with brainstorming techniques.
• are encouraged individual thinking within groups
• learn the importance of empathy

2019

various

various

4

design thinking / creative confidence / collaboration / brainstorming methods / innovation

Results.

• Where multiple student groups worked the same problem, each group followed the process yet came up with different, viable solutions. 
• Following my workshops each student can speak to the value of the design thinking at the end of the session.
• At an event where students rotated various workshops, my design thinking workshop won the highest scores in post even survey results

October 2018

Strategist, Information Architecture, Visual Design Lead

Sketch, Powerpoint

“As a website admin, I need that is easy to update and that our students will engage with."

Problem.

The current Link Program web site is difficult to update from an admin perspective. For users, it’s difficult to navigate and read from mobile devices. For this reason, students do not use the site.

Strategy.

• Determine a CMS platform to power the site.
• Incorporate a task management tool to keep the working team on task.
• Identify opportunities the current site missed.
• Identify a design template to do the heavy lifting of coding and to eliminate the need for a full visual design process.
• Architect the site then customize the design.

My Role.

• INITIATIVE.
  When I joined the LINK website team, the Project Lead was contemplating CMS systems. I suggested Joomla due to its reasonable learning curve and extendability through its applications templates. I presented a comparison of the top 3 CMS systems and the team agreed.
• PROJECT MANAGEMENT.
  To ensure the team was on track our Lead set up weekly meetings. I suggested a task management system to ensure we stay on track with requests and were held accountable to our responsibilities. We implemented Asana into our admin process.
• PRESENT TO LEADERSHIP.
  I then created a presentation for the LINK leadership team including the CMS justification, project roadmap, budget. Our entire proposal was immediately accepted. See presentation
• FRUGALITY.
  Since we’re volunteers, we donated our time for the design and development. Based on component research I determined total expenses at $240 for phase 1 and $150 for phase 2.
• DISCOVERY & ANALYSIS.
  Our project lead chose a template and I determined the components. We did this before architecture and design to minimize the need to outsource customization and increase budget.
• UX DESIGN.
  I created the experience for the events section of the site while my partners created the experience for information pages. As part of the Event Management experience, I integrated MailChimp into our site.
• INITIATIVE.
  Our project lead took a hiatus from the Program due to (happy) life events. I assumed the role of Project Lead.
• SIMPLIFY.
  After exhausting all options create easily implement pages with the existing template I made the decision to scrap it. I immediately found a new one which was easier to use, with a visual design more closely aligned with our primary target audience: creative high school students.
• DEVELOPMENT.
  I installed the template and all components on the platform and customized the design by creating a design system, and updating the PHP, HTML, and CSS.

2017

Seattle, WA

Arts & Education

3

Results.

I came in 55% under budget. I was able to reduce the applications needed for phase 1.

The website launched 5 months late due to changes in the web team’s availability, collectively. The unanticipated change to the design template also cost us time. To prevent further delay we launched with critical components:

• Event management & online registration.
• Program overview summarized on the home page.
• FAQs
• MailChimp Integration

The Volunteers, About and Student Benefits sections are currently being built.

Student & volunteer registration management is completed online with a 70-100% response rate for each event since launch. This significantly reduced time spent creating and reviewing correspondence over the previous manual communication process.

October 2018

ux designwireframesprocess development

Strategist & Information Architect

Sketch, Pen & Paper

Joomla CMS

“As a volunteer, I (Jovon) want to improve and automate our event registration process and eliminate RSVP by "Reply-all."”

Problem.

• Students, our primary audience, do not use our site.
• The existing CMS was difficult for the Program Director & volunteers to update.
• The Events section could work harder by automating some of the manual work done by the volunteers and the program director.
• Official notice of our workshops was sent out 7-3 days prior to, and via email TO: all volunteers. Each volunteer would reply-all their attendance/regrets.
• Responses that needed all volunteers attention were often overlooked due to inbox clutter.
• Student registration was manually tracked in a Google Sheet, only.
• Since Joomla’s applications are pre-coded there will be constraints to the user flow, architecture, and visual design.

Strategy.

• Determine the needs of the parents, students, volunteers, and web site admins.
• Research all Joomla Event Management applications. Find one that is feature rich and inexpensive.
• Since these applications are pre-coded there will be constraints to the UX and architecture.
• Incorporate MailChimp and RemindApp into the communication process.

My role.

• DISCOVERY.
  I created a spreadsheet to compare all features of the Joomla event management application may meet our needs. I narrowed the list down to two. Purchased them both installed and stress tested them with a few events from the current site, plus functionality we wanted to incorporate. Presented my recommendation to the team. I received buy-in.
• ANALYSIS.
  I downloaded the event application’s underlying PHP databases with and manually extracted all event details (2012-2018) from the current website. Then uploaded the complete data to the staging instance of the site. Once all event details were available on the staging I was able to get a full view of the pre-built customer journey and identify gaps and optimize it.
• ARCHITECTURE.
  Entry points were determined as part of the overall site architecture. I determined which stage in the flow event flow each entry point would drop the user.
• DEVELOPMENT.
  I re-architected the content from the out of box layout by manipulating the PHP, HTML, and CSS to match a fluid layout that would meet the user’s needs.
• PROCESS DEVELOPMENT.
  To inform students, parents, and volunteers of upcoming events, I integrated MailChimp generated notifications directing the user to the event details page to register. In an effort to communicate better with students, I also incorporated RemindApp to communicate with students, parents, and volunteers via text without sharing personal phone numbers. Since the site is now responsive users can sign up on their mobile devices from a direct link in the text message.

October 2017

Seattle, WA

Arts & Education

3

web site redesign / creative strategy / design thinking facilitation / process improvements / identity update / workshop development

Results.

Student & volunteer registration management is completed online with a 70-100% response rate for each event since launch. This significantly reduced time spent creating and reviewing correspondence over the previous manual communication process.

April 2016

design systemresponsive design

Project Lead & Art Director

PhotoShop, Illustrator, InDesign

Adobe Experience Manager CMS

“As a stakeholder I need our organization to implement a faster, efficient, device agnostic method for delivering offers to customers without a complete redesign or a release for each initiative.”

Background.

In 2015 AT&T decided to take the plunge into responsive design. In addition, the current site platform which launched in 2010, was not responsive and performing slow. To make up for the lack of responsive content, in 2012 we launched a separate mobile site. However, that created two sites to maintain which doubled the effort in updating and creating new content. Additionally, the methods & styles to design for the 2010 site were archaic by 2015.

Strategy.

1. Update the platform to Adobe Experience Manager (AEM).
2. Create a responsive website, with a mobile-first content approach.
3. Move away from page templates and create a modular design system so pages could be built/updated by content implementors and released daily, instead of by developers and released on a project schedule.
4. Utilize the newly emerged Digital Standards team to ensure design, code, copy and accessibility requirements were built uniformly.

My role.

I was asked to oversee the creative efforts to redesign and "responsify" the upper funnel pages of att.com. This was 12-15 pages, plus up to 3 versions of each for regional and authenticated-user specific content. The project was underway when I was assigned the initiative. Some of my tasks included:
 

1. PROJECT LEAD.
   I coordinated the efforts of our external design agency, UX research, content implementors, development team, and copy strategists.
2. RESOURCE MANAGEMENT & MENTORSHIP.
   The initial design was heavily dictated by an external design agency. I wanted to give our internal talent, who’d be sustaining this work, an opportunity to grow their responsive design skills. So I pulled designers to ensure they were getting acclimated to the responsive design process we were creating before deadline and metric dependent work assignments were handed out.
3. WIN TRUST.
   I worked with stakeholders to gather their content and functional requirements for a redesign. We started lean, so some of the requested functionality would be placed in a backlog. I made myself available to attend regular Q&A sessions with stakeholders to alleviate their concerns.
4. PROCESS CREATION.
   I created a workflow with input from the the development and content implementation team, to create a feature request intake process. This allowed product owners to request new pages, content updates, or functionality enhancements starting in Phase 2. As part of this process, I created an intake form to track requests. Requests were submitted to me or my producer. Once vetted, I'd assign an IA to provide an analysis or solution.
5. PROCESS DOCUMENTATION.
   I designed our module “bible” which contained detailed information on each component at each breakpoint.
6. QUALITY ASSURANCE.
   I performed Visual QA on each component to ensure each component was coded to spec, at each breakpoint on Chrome, Firefox Safari, and Internet Explorer.
7. TRAINING & SUPPORT.
   From March - November 2016, I held multiple training sessions to ensure the standards team, design teams, content implementors, and copywriters knew where to access the files, documentation.

2007

Bothell, WA

Telecom & Entertainment

A lot!

Achievements.

The AEM Multi-screen redesign launched in April 2016.

I oversaw the creation of 99 module templates across 3 breakpoints, which replaced over 1500 templates.

Product Owners were no longer restricted to template-based pages. A section of a page could be updated through the daily release process instead of a full development effort.

I created a repository for assets available to all disciplines and external vendors.

I helped promote and encourage collaboration with the newly established standards team by following and referencing their guidelines.

July 2018

wireframesux design

UX Consultant, Lead Information Architect

Illustrator

“As a product owner, I would like your UX recommendation on optimal presentation for our new streaming service. We have a tight timeline, minimal budget development budget.”

Problem.

1. The current iteration of the page architecture is based on business goals, not the customer's need.
2. There is little development budget so the recommendation will likely not be implemented and launch.

Process.

I analyzed the customer journey and content strategy. This is what I discovered:

1. Customer Journey. Not all football fans will be eligible for the streaming service. The original page flow takes the user to the landing page where they can learn and get excited about the benefits, only to realize they may not be eligible. This could lead to user disappointment, and negative feelings toward AT&T. Feelings leave a lasting impression on people.
2. Content Strategy. The content hierarchy prioritizes the business goals and does not align with the users mental model for processing this type of content. The information layout is not intuitive nor easily scanned.

Solution.

1. I created a new customer flow, which moves the eligibility checkbefore the landing page. This way users will be segmented and only those eligible arrive at the landing page.
   
2. I re-architected the page by ordering the content from a customer-first perspective and providing a mobile-first copy strategy. I created a wireframe of the page in mobile, then desktop and compared it against the original design by spelling out the differences.
   
   
   If the information is presented in a way that it resonates with the user, the business is better positioned for conversion and theoretically meeting the business goal.

2007

Bothell, WA

Telecom & Entertainment

So many.

Results.

The product owners were receptive to the feedback and agreed with the recommendation. However, their lead time for requesting a consult did not align with development deadlines. They plan to revisit these recommendations in a later phase.

February 2018

prototypeux designuser testingux research

Information Architect, Design Consultant

Adobe XD, PowerPoint

Adobe XD

“As a product owner, I need a functional prototype to user-test the optimal presentation of “call me” functionality in the Switcher Flow.”

Problem.

FUNCTIONAL: In order for a DIRECTV customer to actually switch wireless carriers, he must speak to a rep. We also know most users will expect to complete a process online when they've started online. How might we mitigate abandonment by creating an efficient way for a customer to speak to a call center rep?

 

DESIGN: The current design does not meet color contrast (accessibility) requirements and the content hierarchy needs improvement.

 

Strategy.

To add functionality to the Switcher Flow so the user can schedule a time for the rep to call him instead of waiting on hold indefinitely. Mobile first. This flow contains a lot of content and I need to ensure it's easily understood. If we master the hierarchy on the smaller screen, we can easily apply the design to larger viewports.

Solution.

I wanted to maintain the original structure of the flow which allowed the user to complete the entire process on one page. Being cognizant of cognitive load, I applied the chunking principle and progressive-reveal to break up the content. Then added in the new feature of collecting the user's contact info allowing him to schedule a call back from as soon as 15 minutes, up to 48 hours.

 

As a courtesy I also presented the product team with a list of the aesthetic issues in the original design. They updated the design as a result.

2007

Bothell, WA

Telecom & Entertainment

Hella

visual design / ux design / art direction / people management / process development

User test results.

 

• 10 of 10 participants completed the flow quickly and easily—“incredibly easy".
• 8 of 10 participants wanted earlier notification that switching requires a callback.
• 9 of 10 participants understood the benefit enough to move forward, most expecting more details before deciding.
• 10 of 10 participants liked the overall design—“Very appealing” & “Easy to follow and easy on the eyes”.
• 8 of 10 participants preferred the two page split over a single page flow.
• 9 of 10 participants quickly and easily used the grid, all liked it—“clear and easy” & “easy and convenient”.
• 8 of 10 participants preferred the grid over the list.

 

Visual Designer, Design Strategist

January 2018

visual designconceptualdesign strategy

PhotoShop, Illustrator

“As a product owner, I want to offer our customers gift cards. I am making a pitch to our business executives and need a supporting visual.”

Opportunity.

While researching opportunities for the holiday 2017 season, the product owner noted a potential revenue miss with AT&T: A gift card program. Companies that utilize gift cards reported an average sales lift of 60%.

Strategy.

Instead of creating one gift card, I designed a range of options. My strategy was to offer variety to the customer while promoting for our lines of business.

1. Gift givers want to buy products that match the recipient's personal style. Let’s provide a level of personalization through our variety of product offering.
2. The variety of products serves as an opportunity to showcase products, services, and entertainment content.
3. Gift card designs can also align with annual offers like Back-to-School or Valentine’s Day.

Solution.

I determined 5 categories to show that would meet customer and business needs.

• Categories 1 -3: AT&T branded, DIRECTV content, and popular/featured products. I used the AT&T brand as well as licensed images.
• Category 4: Occasions. For Valentine’s Day, I selected a stock image a designed a milk-froth AT&T logo. For the Back-to-school design, I used a chalkboard theme converting our logo to a chalk texture image and pairing that with the back-to-school appropriate typography.
• Category 5: eGift Card. For last minute gifts and busy customers, the eGift provides a variety of styles OR the option upload your own image.

2007

Bothell, WA

Telecom & Entertainment

A lot!

visual design / ux design / art direction / people management / process development

May 2018

instagramfacebooksocial mediamarketingdesign

Strategist, Designer

PhotoShop, Illustrator

Instagram, Facebook

Problem.

TruVintage66 is a local business whose sales are generated from trunk shows and festivals, primarily in Seattle. We needed to create awareness in the D.C./Maryland/Virginia metro area (the DMV). Though the owner/artist has a large network in the DMV, she was looking to reach new, potential customers.

Strategy.

1. To create a multi-day campaign instead of a singular post. This would allow us to maximize reach and ensure the message was repeatedly delivered.
2. To leverage a low-cost marketing tool to reach TV66’s target audience (women, African-American women & men, age 30+) in the DMV.
3. To showcase the products because TV66 does not have a website.
4. To design a theme that that matches the products and TV66 owner/artists style and standards.

Solution.

1. I came up with the concept of a 10-day countdown leading up to the Festival for the multi-day campaign.
2. I utilized Facebook's marketing tools to reach TruVintage's target audience in the DMV. I boosted posts on Facebook and Instagram.
3. My countdown campaign created an opportunity to feature over 10 pieces across TV66's jewelry line.
4. All TruVintage66 jewelry is one of a kind, so I created a design strategy to visually represent the products. I incorporated handwritten typography to align to the uniqueness of TV66 accessories. I paired that typeface with a thin, elegant font to draw on the elegance of the jewelry. TV66's brand colors include chocolate, and raspberry, and kraft paper tan. I used combinations of those colors for the countdown tags on each post.
5. Post 7 ("4 days until") featured a "sold" stamp to create desire since people tend to want what they can't have/what others have.

“As a Seattle area business owner, I need a campaign strategy and design promoting my vendor space at the Capital Jazz Festival.”

2011

Seattle, WA

Jewelry, Art

18

Results

Total 2-day sales exceeded goal by 20%.

67.1% of impressions resulted from hashtag selection.

41% of the people this campaign reached were not current customers.

4% new followers gained through this campaign.