isral Duke | Designer | Art Gallery App

iPhones on a table with the art gallery app on their screens.

Art Gallery App Details

Two phones, one with the home screen of the art gallery app, the other with an art collections screen of the app.
Two phones, one with the ticket purchase process started and the other with the ticket purchase confirmation.

Mobile app allows art gallery visitors to plan trips, see current artwork collections and buy tickets.

Try it yourself

Project Role & Goal

During the art gallery mobile application design process I acted as the UX Designer and User Researcher. The goal was to create a new mobile experience for the gallery. The app helps visitors buy tickets in the app, shows them upcoming gallery events, and helps them plan their visit to the gallery.

Target Audience

The target audience is composed of two primary segments. The first segment is made up retired, senior visitors who often rely on third parties for transportation to the gallery. They need accommodation and accessibility information for their visits. The second segment is made up of young professionals who can visit the gallery in the evenings and weekends. The second segment is most likely to buy tickets in the application. Both segments expressed a desire to attend weekend events at the gallery.

Art Gallery App personas, Bao and Dottie, representing two age groups.

Key Challenges

The key challenges in the process was arranging for the in-person usability studies for the seniors who make up the first segment of the target audience. Segment two was comfortable with video interviews.

Research

The research began with online surveys to determine the content in the mobile application which users most likely expect. Participants were chosen from people who normally visit art galleries and art museums. The seniors who represent the second segment of the target audience participated in in-person usability studies. I conducted remote interviews with participants who represented the second segment of the target audience.

Initial Design Concepts

Paper sketches were used to capture initial design ideas, using crazy 8 methodology.

Initial design concept sketches for the art gallery app.

Digital Wireframes

The best ideas from initial design concepts were translated into digital wireframes.

Digital wireframes created from the best hand sketches.

Usability Testing

Usability testing data was recorded in a spreadsheet for each of the participants. Each participant was asked to perform key tasks in the wireframes. Moderated, remote testing enabled us to answer questions about the function about the wireframe setup verses the actual wireframe design. Testing occurred with digital wireframes with some follow up in the mockups.

Affinity diagrams distilled from usability testing insights.

Conclusion

For the next steps I want to design an Apple Watch app to go along so that visitors can scan their tickets on their wrists. This would make it easier for seniors who use Apple Watches to enter the building using walkers or other assistive instruments.

Certifications

Continuing education is an important part of being a designer. Staying on track in technology means serving the users. This also means watching the industry leaders and learning from them.

W3C Accessibility

It makes moral and business sense to ensure everyone can use your app.

View Certification

Google UX Design

I studied Google’s own internal UX process for knowing what users need.

View Certification

Interaction Design

People respond to digital products based on prior experiences in combination with our brains’ wiring.

View Certification

Adobe Photoshop

Photoshop is the market leader of for image manipulation.

View Certification

Skills

UX

UX Design is discovering and knowing what to build. UX means talking to users and getting their input.

  • Accessible Content Development
  • Information Architecture
  • User Research

Design

Interaction Design is creating an interface or process around the users’ problems and goals. It’s informed by the UX research phase.

  • Accessible & Inclusive Design
  • Creative Cloud
  • Figma
  • Graphic Design

Tech

Technology is how users’ solutions are built. Good design takes technology into account.

  • Accessible Markup
  • Bootstrap
  • HTML / SCSS / CSS
  • GitHub