top of page
Changing the way children
think one swap at a time
The Task
Design a child-friendly mobile application that encourages users to develop a less materialistic approach to spending.
Timeline
Dec 2020 - Jan 2021
Design Team
Me
Myself
& I
My Roles
Everything.
-
Defined the scope and goals of UX research
-
Compiled information architecture
-
Designed wireframes and high-fidelity prototypes
-
Facilitated usability testing and validation
-
Designed UI components and developed some graphic assets
Project Description
Swapsies started as UI project for a second year subject at RMIT University. After achieving a high distinction for Iteration 1.0 of the project, the application was modified to fit the requirements of a UX case study and in turn, future commercialisation.
Research
User Interviews
An important kick-start to the research process where a small range of specific users were asked a number of questions to inform the design and conceptualisation process for Swapsies. Considering the app had already been designed in its first iteration, it was critical for interviews to aid in the refinement of iteration 2.0 and beyond.
Demographic
Key Insights
5 participants
5 questions
Diverse age range (10 - 50 years old)
Mix of children, parents and teachers
Questions modified from child to adult
-
Parents found that using chore lists made their children aware of responsibility and its importance.
-
Children acknowledged that some children's monetary reward for chore completion was higher than theirs. This caused a discrepancy in what children could purchase and revealed that some children were jealous of others as a result.
-
Parents noted they felt obliged to purchase the latest and greatest for fear of their children not succeeding socially without.
-
Teachers mentioned that given that a family's economic situation varies from child to child, inevitably some children will feel left out when children purchase new items with their pocket money.
Why User Interviews for research?
Talking to prospective users about their current chore management and toy purchasing practices allowed for a greater understanding of the reception an app like Swapsies would receive from parents and children alike. The opportunity to ask open questions invites the participant to discuss the question at length and give answers based on their experiences. The insights gathered are key for the empathy mapping process, allowing for specific design choices and further visualisation of the users.
Empathy Mapping
This secondary research stage allowed for a deeper understanding of the prospective users - both primary school aged children and their parents. Through mapping feelings, thoughts, sayings and doings, the project had a new-found level of clarity and a source for further UX decisions.
What were the Outcomes of Mapping?
With the parent as the established persona, mapping their insights from User Interviews highlighted distinct concerns with their current habits regarding the management of their children's chores and queries surrounding monetary demands. Parents ultimately want to:
a) Encourage their children to foster an understanding of charity and giving within their local communities.
b) Decrease the reliability on new toys and gadgets for their children to satisfy their demands.
c) Have confidence in the choices they make for their children's wellbeing and have decisions reflect positively within the community (children's friends, their parents, teachers).
d) Impart a sense of responsibility and understanding of goal setting to their children.
Whilst children are also a key focus, they are still fundamentally guided by their parents and decisions made will always be parent motivated. The core user was established as the parent, with children as secondary users.
Why Empathy Mapping for research?
Mapping the users thoughts and feelings provided the design process with a visual aid for reference throughout the idea conceptualisation and prototyping phases. Influenced by the insights gathered from User Interviews, it remained a foundation to staying true to user intentions throughout the project. A challenge was reading facial expressions and determining the feelings of the user over Zoom interviews - resolved at the loosening of COVID restrictions allowing for physical mapping sessions and testing.
Market Research
A crucial activity that allowed for an exploration and understanding of similar applications. By looking into two products, gaps in the market could be identified and areas of similarity can be improved upon with Swapsies.
What is it?
YoungPlanet
Launched in 2017
Compatible for iOS & Android
Aiming to reduce landfill, clutter and promote a positive community experience, YoungPlanet is a UK based app that exists for parents to list and acquire items. With a bright and inviting UI, simple filtering and listing experience, parents can beat 'product obsolescence'.
How will it differ from Swapsies?
Whilst the parent experience mirrors what Swapsies would want for its listing/swapping functionality, there is little to no interaction for the child. This remains a key component of Swapsies in aiding the joint experience for parent and child whilst encouraging the development of other skills i.e. completing chores and receiving rewards.
LoopdKidz
What is it?
Launched in 2019
Compatible for iOS
With a brief mission to 'reduce toy waste, one toy at a time', LoopdKidz's focus is solely on swapping and giving away toys. Whilst some functions like 'friends' and 'favourites' remain in the works, the core functionality remains. Parents can post and approve swaps while the child can review swaps themselves on their own account.
How will it differ from Swapsies?
Whilst the purpose of LoopdKidz was realised, the functionality for the child differed only slightly from that of the parent. Swapsies will endeavour to have a feature that allows children to have a unique experience on the app i.e. completing chores to earn a swapping experience.
Why Market Research for research?
Gathering intel on other applications in the same market as Swapsies allowed for an acknowledgement of similar design ideas that pre-exist. Ideas can be formulated based off these applications and/or improved upon, whilst new elements can be added to generate a larger target audience and create competition within the market.
Explorations
With any UX or design task, explorations are integral part of the design process. Looking at multiple design avenues and exploring the possibilities and outcomes of each leads to a well-rounded refinement of a design idea and confidence in the final design itself.
Before Iteration 1.0
What were the Outcomes of the Explorations?
Three preliminary design avenues were explored after the collection and analysis of the research phase. Whilst all three had overlapping ideas, it was determined that for the inclusion of chores and community involvement, Toy Swapping would adequately tick all of the user satisfactions and requirements.
-
Toy Swapping
A succession of progressive design ideas were brought forth in this exploration which will result in a refinement of iterations and (fingers crossed) a final design. This design exploration saw the inclusion of parent/child application features that allowed for dual interaction and maximum involvement from both parties.
-
Consumerism Awareness
The least progressive exploration saw the introduction of another points system centring around the restraint from materialistic purchases. A beginner foray into the ideas surrounding decreasing materialistic attitudes, the exploration was unable to gather momentum due to the quality of other explorations and potential for the idea to engage users.
-
Money Matters
An exploration that has been attempted in the past by the likes of Dollarmites, this avenue investigated ways in which parents could develop a better understanding of how to instil proactive saving habits for their children. Further ideation uncovered the possibility of encouraging voluntary behaviour as a means of fostering gratitude and personal development. However, the enjoyment for children in a toy swapping app was deemed to be an important design factor along with the logistics of including banking information for children (safety and privacy concerns).
Information Architecture
With a concept realised from multiple explorations and the collection of data via research, a simple visual hierarchy can be created to illustrate the sequencing of key application elements. Organising content is a key stepping stone to creating a system where the user feels confident and comfortable navigating and finding their end goal.
Why was this particular content chosen?
To make the life of the designer simple (but more importantly, the navigation for the user), a concise architecture was created showcasing only the most important clickable features that the user would want to engage with. The diagram is however, slightly separated into two sections. The 'Chores' content denotes the action that children, as the primary user, will have. Similarly, the 'Swap Shop' section is organised in the most relevant and simple order for parents to navigate.
Reflections on Process
After completing the Information Architecture process, it was discovered that conducting a 'card sort' as part of the initial research phase would have been immensely helpful. Determining from the users perspective as to what content was appropriate and necessary could have aided in the design of navigation and subsequent user flow and also removed the burden of having to determine the former solo.
Refinement
Iteration 1.0
Kickstarting the back-end of the design process is the first iteration of Swapsies. Initially developed in response to the UI-only university brief, it remains a necessary design component that paved the way for future iterations in regards to both content and stylistic choices (and understanding the importance of UX!).
User Flow
Wireframes
High-Fidelity Examples
.png)
.png)
.png)
.png)
.png)
Why were the following design choices made for Iteration 1.0?
Referring to the user flow, wireframes and high-fidelity, several introductory screens were developed for the first iteration that progressed through to further iterations. It was integral for the chores section to be concise and one-click for the ease of children's navigation. For the 'Swap Shop' and beyond, mirroring the buy/sell processes of other applications like Depop and Etsy, would give parents a familiar context for their listing/swapping endeavours. The colour choices explored in the high-fidelity would remain one of the key outcomes of the first iteration to be continued onto the second.
Iteration 2.0
After reviewing Iteration 1.0 post university submission, it was established that a more rigorous thought process was necessary for the logistics of the 'Swap Shop' and further refinement of the UI. Whilst a formal user testing process was not conducted after the first iteration, an internal investigation highlighted causes for concern and essential changes to be made to produce a product that was deemed fit for user testing.
User Flow
Wireframes
High-Fidelity Examples
%20copy.png)
.png)
.png)
.png)
.png)
Why were the following design choices made for Iteration 2.0?
Iteration 2.0 saw the birth of a sophisticated and bold approach to designing Swapsies. Refining from the first iteration, subtle design changes were made to the user flow that allowed for enhanced user experience in regards to requesting and acquiring items. Translating to the wireframes, the children's 'Chores' section developed a new look and feel allowing for clearer navigation with a '1 tap' approach. The Swap Shop' also received a revamp which allowed for trendier browsing and clearer viewing for elements like viewing the listing and creating a listing. It was important that as the design idea evolved, so did the UI.
Reflections on Process
The insights gathered after two iterations of physical designing were substantial and the result of relentless hard work! Going back to UX principles and fundamentals after Iteration 1.0 allowed for the growth and possibility of Swapsies to be fully realised. Considering the heavy constraints on the initial university assignment (purely a UI focus, no UX involved in the creation), it was enlightening and encouraging to see how approaching Iteration 2.0 with a fresh UX mind could have such an effect on a design. Despite the large success with Iteration 2.0, it was not without its frustrations as the logistics of swapping methods introduced in both iterations proved difficult to realise, jeopardising the validity and success of Swapsies as a concept.
Compare and Contrast
Before unveiling the Final Design, a brief overview of the similarities and differences between Iterations 1.0 and 2.0 should be discussed to ensure clarity.
What remained the same across both Iterations?
-
Separating child and parent experiences (children engaging with 'Chores' and parents with the 'Swap Shop'
-
Including a points viewing function for 'Chores'
-
Creating, viewing and browsing listings in the 'Swap Shop'
-
The fun, vibrant and engaging colour palette that can appeal to both children and adults
What changed from Iteration 1.0 to 2.0?
-
The ease at which children can check off chores
-
Side menu navigation became cleaner (thanks to a trendy design idea by Valeria Terekhina)
-
'Swap Shop' browsing developed a swipe item card system and clearer browsing from the search bar
-
The action of acquiring listings was more realistic and feasible - switching from delivering the listing to a local op-shop (would require collaboration with other companies) in Iteration 1.0 to direct messaging a parent and negotiating pick-up of an item in Iteration 2.0 (no middleman)
User Testing
Although hard to hear, constructive criticism is key to the design progressing to its full potential. User Testing plays a critical role in identifying causes for concern within the high-fidelity prototype and gives the designer an idea of how the users interact with and perceive the application.
Demographic
User Tasks
3 participants
5 tasks
10 - 25 years old
15 minutes
Questions modified from child to adult
-
As Sam (a child), mark 2 chores as completed
-
Navigate to Points Pal
-
Navigate from Sam's Chores to the Swap
Shop
-
Create a listing in the Swap Shop
-
a) Browse the Swap Shop for 'Custom Barbie
Doll' and select the listing
b) Favourite the listing
c) Locate the listing in favourites and contact
the owner (start a text chain)
What issues arose from the Testing feedback?
Issue #1
Participants found using the side navigation confusing. Once opened, it was unclear of how to navigate to the new or pre-existing screen. This was initially achieved by re-tapping the hamburger menu and the new or pre-existing screen animating into view.
This feedback showed the importance of user testing - where a crucial element is not necessarily inherent to the designer, yet key for the users understanding and progression throughout the application.
Issue #2
An initial design fault caused participants to have difficulty navigating from 'Home' to other Swapsies screens due to the lack of hamburger menu.
A silly error on the designers behalf!
Issue #3
Some participants found the coloured highlighting under screen headings caused the title to look disjointed and difficult to read (view circled 'Welcome' title).
Although it was disappointing that the design feature had not been received as expected, it was a lesson to separate oneself from the attachment to the design process and listen to the wants and needs of the user.
.png)
Final Design
After countless hours of ideating, research, exploring and refining, the final design sits proudly below - complete with an explanation of the UI elements used and interactive prototype.
UI Elements
Colours
#424F8E
#FC8B4F
#D13B3B
#5FA344
#EDD942
#FA8FE5
#3E3D3D
#C5C4C4
Font Styles
Page Title: Letters for Learners Regular 48pt
Section Title: Gill Infant Regular 26pt
PARAGRAPH TITLE: GILL INFANT SEMIBOLD 10.5PT
Paragraph Text: Gill Infant Regular 10.5pt
Images from Pexels
Icons from
Icons8
Why were the following colours and fonts chosen for Swapsies?
UI played an enormous roll in enabling Swapsies to come to life and remain appealing for both children and adults. In the Iteration 1.0 assignment process, the aforementioned colours received critical acclaim from peers and lecturers alike and were praised for their bright appeal and mattified texture. Using bright colours immediately engages the user whilst playing into the fun and carefree nature of children. The fonts were also carefully thought through and changed from Iteration 1.0 to 2.0. For the titles, chalkboard or school handwriting style fonts were preferable to give a child-like feel. For the body text, 'Gill Infant' was a recommended typography choice for children as letters like 'a's and 'g's closely replicate letter writings taught in school and are easy to read.
Reflections on Process
Thank you for making it this far! From start to finish, Swapsies was an engaging and exciting project that posed frequent challenges, many twists and turns, yet finally eventuating in a rewarding prototype. Despite the initial constraints of the Iteration 1.0 RMIT University assignment, Swapsies was able to thrive and grow after appropriate UX considerations had taken place (research, Iteration 2.0 and user testing primarily).
What would I change about the project?
One of the most significant changes would be adding team members! Given the nature of Swapsies' beginning, the project was solo and remained that way until the end, resulting in a ridiculous amount of hours researching, designing and putting this case study together! Having the input of others would help the project travel in new and exciting directions, with a wealth of knowledge from different minds behind it.
%20copy.png)
%20copy.png)
Create custom chore lists for your child
List and swap items with other kids using Swap Points
.png)
.png)
%20copy%203.png)
%20copy%204.png)
Chat and exchange swaps with other parents in your community
bottom of page