Company Background

Discoveryee Lifestyle App


Discoveree is a lifestyle app created with the purpose of increasing traffic and activity for all the retail outlets around Changi Airport. The company who commissioned it is called goGames a subsidiary of a gaming company called SEGA. Discoveree is a big project with multiple moving parts. You got the merchants onboarding, the consumer facing app and the admin dashboard. For this portfolio piece we will be looking at the UIUX process for the consumer facing app.

1. PROJECT OVERVIEW

The Business objective of Discoveree was to bring more traffic and consumers to all the retails outlets around Changi Airport Singapore. The app would recommend the user different activities and allow them to create a feature called "Trails" that operates a lot like a visual diary of the activities you did that day. These activities can then be shared via social media or within the application. The goal of this feature was to encourage engagement and to grow a community of users.


THE UIUX BRIEF

The main persona for this application is the consumer. The application will advertise and promote deals that are dynamically added via a onboarding platform called "Discoveree merchants".


DESIGN CHALLENGES

Create a unique fun experience that cultivates more activity to Changi Airport

  • Unique functionality behaviours to navigate through deals and listings
  • Implementation of trails feature
  • Organising the hierarchy list of user actions based of business goals
  • Uniqueness of Design

  • My role

    Lead UIUX Designer

    Project timeline

    12 months ( Indlucing Development )

    2. My Design Process

    The design process only contains the steps taken for the Discoveree App. The project as a whole is divided into 3 parts. Merchants, Admin and consumer. For this project we will be looking into the process I took creating the consumer section.


    Step 1. OVERFLOW

    Collection of requirements

    A Core functionality Document was provided to developers to start the project. We reference this document and start creating a sitemap of the interface.

    Step 2. OVERFLOW

    User Research

    With the brief we start creating different personas into sub personas. Consumer is the main profile but the sub profiles include: Older users, Young Male and female.

    Step 3. OVERFLOW

    Information Architecture

    We start creating User flows based on the profiles we made and begin the huge task of planning the information architecture of the application. We lay down a first draft of where all the images and buttons will be populated.

    Step 4. SKETCH

    Look and Feel

    First we create brand guidelines and establish the text treatment and colour palettes to be used within the app. We then collect many different ideas for the app from around the web similar to the look we are going after and create a moodpboard of ideas.

    Step 5. FLINTO

    Prototyping functionality

    With the Information architecture as a guide the task was to then plan out the functionality behaviour. Low-Fidelity prototypes were used to experiment on small features like scrolling and swiping gestures. the goal was to decide on which functionality was appropriate for its usage throughout the applicatoin.

    Step 6. SKETCH

    Refinement

    We were adopting Agile management in our production so a lot of business and engineering decisions were made on the fly. This translated to a lot of revisions as we constantly altered the design of our applicatoin.

    3. UNDERSTANDING THE PROBLEM


    After onboarding our user. We needed to collect preferences of the user as this data would be essential for establishing a profile to reference what deals and items they me interested in. We did this by incorporating sign up wizards in our onboarding process.


    Persona type:
    Consumer

    User flow of main consumer

    The document shows the generic user sign up process and the different areas they can access once they registered an account.

    4. INFORMATION ARCHITECTURE

    The sitemap provides a good reference to developers of how the application is structured. This helps them with planning how the end points are connected with the API and what type of server architecture is required.


    5. INITIAL IDEAS

    Engagement was the core focus of the User Experience. The unique features of the application in regards to its Trails system and browsing of deals had to be engaging but not draggy. Below are some of the ideas we explored for the main features.


    Information layout

    Images, buttons, menus, form fields. All of the first draft planning of what and where things should be placed.

    Activities

    We reference the design used for tinders matches and incorporate a bookmark feature. Items swiped right are saved to your saved panel.

    Trails

    We breakdown the information of the listing into 3 screens. This helps keep the application clean and more legible.

    (click thumbnails to see more)

    6. Production wireframes

    Below are the final production wireframes for the project. (In some projects I cannot showcase all of them due to confidentiality issue).


    7. Design Systems


    8. Final Thoughts

    I enjoyed the opportunity to work on a lifestyle application. However I feel that UIUX design process was introduced too late. UIUX planning should have been made before the core functionality specs document was drafted. This lead to a huge inconsistency with the budget and development time.


    Key takeaways

    Overall I think that the app if executed correctly with the right marketing strategy can be a success. However in terms of quality control, platforms that depend heavily on user generated content compromise the brand look and feel of the app. The branding and quality of the app relies heavily that user are able to take nice images and crop them correctly and provide rich engaging listing sales copy. This was problem was very apparent after its first release.