PROJECT NAME

Arté Social Exhibition
Mobile Application

  

MY ROLE

UX Design
UI Design
Digital Illustrations

 

TEAM MEMBER

Spike Yuan

OVERVIEW

Arté is a platform for updated art exhibitions in Australia and its reviews to share. Arté provides not only new information about art exhibitions but also a social community where people can share reviews of the exhibitions or museums they have visited or they want to visit. 

My job as the Product designer involved researching User experience and designing user interfaces and creating branding and illustrations.

presentation01

ABOUT ARTE

Arte is a platform for updated art exhibitions in Australia and its reviews to share. Arte provides not only new information about art exhibitions but also a social community where people can share reviews of the exhibitions or museums they have visited or they want to visit. The visions of Arte are the first and the best art exhibition platform in Australia and the education of the public through the contents. Furthermore, it will be able to contribute a development on Australian Art and Design industry.

RESEARCH

Arte is a platform for updated art exhibitions in Australia and its reviews to share. Arte provides not only new information about art exhibitions but also a social community where people can share reviews of the exhibitions or museums they have visited or they want to visit. The visions of Arte are the first and the best art exhibition platform in Australia and the education of the public through the contents. Furthermore, it will be able to contribute a development on Australian Art and Design industry.

Survey_Presentation

The survey via Google Form

George-Perosona
Naomi-Perosona

Two of the four proto-personas created for Arté

User-journey

The user journey

DESIGN WORKSHOPS

To begin the design process, our team facilitated design thinking workshops, these sessions were created from activities that I use from Google Design Sprints. I condensed down week-long workshops into daily workshops by picking the methods that have the most perceived value to the group. A quick example and explanations of some of the activities:

  • Lightning Presentations – Present your favourite app relevant to the project and explain why it is good and any limitations.
  • Experience Mapping – Write down who solves the user needs the best “eg buying shares” explain why the experience is good any limitations.
  • How Might We – Write down opportunities and pain points onto sticky notes, then present them to the group, we then affinity map them into patterns and dot vote.
  • Crazy 8’s – Draw out 8 ideas onto a piece of folded paper then present them, the group then dot votes on best ideas.
  • Solution Sketch – Draw out 8 ideas onto a piece of folded paper then present them, the group then dot votes on best ideas.
    After this workshop, we keep all the output and the winning ideas get the chance to be turned into wireframes and user-tested.
Howmightwe_Presentation

Some of How Might We from a design workshop

solution-sketch-1

Solution skeches from a design workshop

SKETCH & WIREFRAMES

For the early-stage concept, we sketched some ideas onto paper to quickly move and prove ideas. Once all members had confirmed a sketch concept, we designed greyscale wireframe on Figma to test functionality such as user flows and journeys for different sections: onboarding, profile, discovery, reviews on the app.

Wireframe-Presentation

Wireframe of whole screens from user testing

article-1

Variation of explore screen (on buttom) for user testing

USER TESTING

User testing lets us find out efficient to invest our time and effort into a design. We conducted to test users for a 1-hour testing session at our studio with a minimum of 2 people per session. We have paid a little money or voucher to thank participants. During the sessions, We make sure every setting are fine and recorded all of the tests in Zoom and then synthesised all the feedbacks or insights on Figma and reflect insights deck withing the team. For user testing, we created moderator guides such as customer profile questions, opening and closing questions and task-based questions. When I give the users tasks and then watched to see how users would complete the tasks without disturbing them or helping out along the way. The sessions provided us with practical evidence of what users would do when they used the real app once we released.

Task One: How would you check the articles

Task Two: How would you check reviews of the art exhibition article and leave comments on the reviews

Task Three: How would you make a review

Task Four: How would you archive lists of the exhibition

STYLEGUIDE & DESIGN SYSTEM

For style guide and design system of Arte, we contain the brand typography, colours, 8px grid spacing system, and basic components. Our Component Library is the base for the whole app and makes us easily enable to make new ideas and quickly mock them up in Figma. We chose to use the 8px grid similar to Human Interface Guideline which allowed us a clean and consistent look and feel.

DesignSystem-2
Screen-Shot-2020-06-16-at-5.31.18-pm

INTERFACE & INTERACTION DESIGN

We created the final Ui designs which are a pixel-perfect for coding. In Figma, Spike and I settled down the style guideline & design system such as colours, typography, and spacing. These guidelines helped us design interface consistency and efficiently work together. We also produced interaction design in Protopie so the developer could tell what would happen transition between screens and other app interactions.

presentation02

The final screens of Arte app

Back to top Arrow