Women and Their Work

non-profit Website redesign

 

Project overview

While enrolled in the UX UI Boot Camp offered by the University of Texas at Austin, we were tasked with redesigning the website of a local non-profit. My group chose Women and Their Work, a local Austin non-profit gallery that’s been a staple for over 40 years.

duration: 3 weeks

tools: Miro & Figma

Problem

Women & Their Work was established to inform audiences of all ages about contemporary art made by women around central Texas. Our group observed that Women & Their Work isn’t clearly promoting hours of operations, ways to get involved, and how to visit, which is causing potential supporters to feel confused and abandon their efforts to engage with the organization.

Business Challenge: How might we improve Women & Their Work so that our supporters are successfully engaged based on an increase in online traffic, improved donations, and return visits to the gallery and exhibits?

Solution

Through interviews with a prior board member & current patron, the design and marketing coordinator, and conversations with the executive director and program director, our group decided to focus on reorganizing the navigation and streamlining the process for volunteers to sign up for a time slot.

  • What was your role? Who did you work with?

    • Our group consisted of Samantha Smith, Abigail Scott, Hyo-Jung (Erica) Jeon, and myself. We evenly split up tasks throughout the project as we came upon each section

[images of current website design, redline annotations, and our final design]


First Steps


Interviews

  • 2 stakeholder interviews to go over how they thought the site was set up, what they liked/disliked

    • was only able to schedule 2 interviews with stakeholders as two other gallery employees (Chris, director, and Rachel, program director, were extremely busy, ideally we would have been able to complete interviews with multiple of the directors / people in charge of the organization

  • Ali as the website’s editor, what did they want to focus on via their website? Promoting current shows, previewing upcoming events and shows

  • Genny as a previous board member and current donor

Personas

Example

As we determined the business problem we were going to focus on for this redesign, we came up with a proto persona,

Guiding Questions:

  • At what point and why did you decide that you need personas?

  • What kind of methods did you use while developing the personas? (User research, or involving stakeholders?)

  • What information did you provide about each of the personas? (context, problems, motivations, etc)

  • How did you present this information to the product team?

  • How did the personas affect design? What new features or design changes came from the personas?

  • At which points of the design process did you reflect back on your personas?

User Journey

Example:

I mapped out the users’ steps to see how I could simplify their journey to help them reach their most important goals with the product.

Guiding Questions:

  • Why did you decide to do user journey mapping?

  • How did you choose the most important user goal to map?

  • How did you determine the steps of the user journey?

  • How do the users feel and what do they think at each step of the user journey?

  • What ideas emerged to improve the experience in certain steps?

  • How did the user journey mapping help you to design a better product?

Card Sorting

Example

I decided on the main categories of the webshop with a Card Sorting session.

Guiding Questions:

  • What was your main purpose? What navigation problems did the website have?

  • What type of card sorting method did you work with? (Closed or reversed, online or in-person)

  • How did the participants group the information?

  • What have you learnt about their mental model?

  • What kind of new navigation structure did you suggest?

  • What changes did you propose based on the card sorting?

Sketches

Example

I usually start the design process with low fidelity wireframes. This is the way I iterate through many design options quickly.

Guiding Questions:

  • What was the main purpose of your sketches? (presenting, testing, brainstorming?)

  • How did your knowledge about your users and their goals influenced your sketches?

  • How many different versions you made?

  • What were the main differences among these versions?

  • Which version did you choose and why?

  • Explain the layout and the arrangement of the elements!

  • Why did you put the elements to a certain place?

  • How did your sketches helped you more forward?

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Guiding Questions

  • Why was it useful to do this?

  • What kind of wireframes did you make?

  • Low fidelity or high fidelity?

  • What tool did you use for this?

  • Did you use them for testing?

  • How many iterations did you have?

User Testing

Example

Before launching the product, I did a testing round in order to reveal possible usability problems.

Guiding Questions

  • What were you aiming to find out with the user tests?

  • At which phase of the project did you test?

  • Who were the test subjects? Did they meet the target group?

  • What method did you use for testing? (Remote, moderated, etc?)

  • What user insights did you get from the tests?

  • How these user insights impacted the design or the next version?

UI Design

Example:

Once I tested out all usability mistakes, I started designing the final screens in Sketch.

Guiding Questions:

  • What kind of visual style did you follow? (Fresh, corporate, dark, light?)

  • What inspired you to use this style?

  • Did you follow any guidelines? (Material Design, iOS Styleguide, etc?)

  • What platforms did you design for?

  • Which details really fill you with pride?

  • How does your final design reflect your learnings about your users?

  • How does this design help achieve business or user goals?

[insert mockup and/or images]

Results

What have you learned from this project?

Explain what you had learned, experienced, or simply how you felt during the project.

  • What were your biggest fears, problems, struggles?

  • How did you overcome them?

Being honest is a good thing, it means that you are aware of what you’re doing.

[statistics with bold numbers / semi infographic style]

[Feedback from stakeholders / client]

Final thoughts

Last thoughts

  • wrap up etc

next steps

  • what am I planning to do with this project next?