Phase 2:
DEFINE + IDEATE

My strategic direction was coming into focus because now I knew who I was designing for, but it was also important to specify what I’d be aiming to solve with Barnsdall’s new website and how I was going to go about it.

Ideation

I began forming a strategy by crafting the three “How Might We” questions below that would ensure I’d be approaching the ideation phase from the user i.e. Sari’s perspective.

  • How might we help Sari Identify ways to spend her time doing art activities that are flexible?

  • How might we help Sari feel connected to what she is doing and with whom she is doing it?

  • How might we make it easy for Sari to find reliable information about art activities?

 
barns final med mind map.png

Product Goals = Business & User Goals

As the UX designer, I knew my job was to advocate for the user…however, I would have to demonstrate that my design would honor the client’s goals as well. I identified the areas of overlap below, which would act as my overarching Project Goals of my design moving forward.

  • Showcase what makes Barnsdall unique

  • Accurate, up-to-date program info

  • Provide creative experiences to students & families

 
FINAL%252BFINAL%252BVENN.jpg

Information Architecture

In my effort to translate research and design strategy into information architecture, I identified potential features that would align with the Barnsdall user’s desire for reliability, connection, and flexibility. Common design patterns and layouts of other arts organizations’ websites also guided my decisions around which features to prioritize.

 

 Sitemap

A successful website must have a structure that is intuitive. And with the roadmap of features in mind, I created a Sitemap to visualize the layout and content of the site, including main navigation, categories, and subpages in a way that I believed would meet the user’s needs and expectations.

 
Sitemap v2.png

Interaction Design

I had the architecture of the website mapped out, but in order to ensure a positive user experience, I explored how users would interact with the product—

Which screens would visitors to Barnsdall’s site encounter in order to complete common tasks and how would it make them feel?

I worked through the interaction design of the website by charting out common scenarios and the path the persona would follow to complete common tasks by creating two types of process maps: Task Flows and a User Flow.

Task Flow Diagram

Each of the task flows focused on a single task that Sari wants to complete, presenting the starting and ending points, actions, and screens she will encounter along the way. An example of a Barnsdall user’s Task Flow is provided below.

Barns-TASK FLOW-SMALLER 2.png

User Flow Diagram

The User Flow below illustrates Sari’s journey as she explores Barnsdall’s new online class, Project Silver Lining (PSL), illustrating what Sari is thinking and feeling as she interacts with Barnsdall’s website. The diagram indicates related scenarios such as registering for the class and browsing the site for more information, including her decision points along the way.

USER+FLOW.jpg
Continue to Phase 3