Belle
BELLE
UX / UI iOS APP DESIGN – 2020
Introducing Belle, a connective calendar designed for communication in a private & secure space. The project focuses on the rise of the Femtech market and negative impact of digital social communities to create an alternative platform for females.
My role and the proposed outcome
Identify new business opportunity that achieves a ‘here for good’ initiative. The project outcome provides a solution targeting the negative implications of social media by offering an alternative platform. The proposed outcome utilises the positive features of social communities in a digital space and disregards features found negative by research that are associated with mental health issues and social media. The design focuses on aspects that enable self and community care.
The solution is aimed at females between the ages of 18-45. Conduct qualitative research by interviewing and surveying users to identify needs/any current issues and gaps in the market. Analyse current market competitors and the target audience to create personas. Design a business model that would be feasible and realistic in a real-world scenario. Create a working prototype using Invision and Adobe XD. Test with users to identify areas for improvement and create solutions based of user feedback.
Research
Market and user
In depth market research was conducted to understand the problems faced by females in social media and reasonings for the continuation of usage. The market and industry research highlight the negative and positive implications and outcomes of mental health issues throughout the population of females.
User research was conducted to gain further and valuable insight into the user group, in addition to an interview with a professional who deals with women suffering from mental health problems.
SOCIAL MEDIA
Research outcomes
User persona
user needs & pain points
Interviews and survey responses highlighted a high interest in the proposition. A design solution that is a calendar based system. The desire for a new application that is an alternative to social media that connects and manages time and communication, alongside personalisation and privacy settings.
The proposed solution
The research was utilised to define what Belle is, and what Belle is not. This includes the design, voice and tone of the brand and its identity along with the key features and functionalities. The solution will focus heavily on designing a concept based on the positive attributes that females utilise and want from a digital community.
The design approach
WIREFRAMES – ADOBE XD
FULL PROTOTYPE – INVISION
I began by creating a branded personality for the application and then sketching up ideas to visually understand and interpret the applications features and functionalities. Once shown to users and with a few adjustments, the concept came to life in Adobe XD. An initial low fidelity wireframe set was digitised and tested with users. Feedback established the need for a more playful, colourful and interactive application with a dashboard style homepage, in comparison to a very corporate and structured approach. The final interfaces were then established and made interactive with the use of Invision following specific user flows. The final prototype was tested and received positive feedback from the user group.
Branding
Branding was created as part of the project to define the colour scheme, app logo/app icon and overall look and feel of the business to reflect the brands personality.
Pen and paper sketching, my favourite way to get started.
First iteration of high fidelity screens
with use of the design branding colour scheme, built components were used to form a UI kit which kept the design patterns and screens consistent and user friendly.
Feedback
initial feedback from peers and the user group was that the design still had the corporate finish and feel. This is not the direction that Belle wanted to take, the aim was to be vibrant, unique and fun. This meant that a secondary iteration of the UI approach was imperative in order to maintain the desired design objectives.
Key changes
User testing provided strong structural feedback, which influenced a more fluid and fun design that is user friendly.
– Additional image used for structure and layout
– Additional colour added to colour palette from chosen image
– New features: wishlist, to do list and quicklink to diary
– Hidden quicklink/chat menu
– Category style calendar
Final – iOS app demo
Interactive prototype
https://invis.io/MVX4JS0ENHZ#/415462654_1
Final feedback
board of advisors and academics at Billy Blue the overall feedback was highly positive with hopes of the project taking the next step to become a start-up concept. The project received a high distinction award.
Marketing website – desktop and mobile web
Mockup example of landing page concept: https://tinyurl.com/ybz43brm
