Role

UX/UI, Interaction

Platform

iOS, Android

Splitwise Facebook Extension

Context

This was a short but sweet 3 week academic project as part of my Interaction Design course in Simon Fraser University's School of Interactive Arts and Technology program.

Role

I was responsible for making the high-fidelity mock-ups for the Splitwise Facebook Extension portion of the project. This included using sketch to create high-fidelity static mock-ups and importing the interfaces into Flinto where I added interactions and animated the screens.

A Facebook Messenger extension, designed to support existing behaviours in group trip planning and the use of group chats.

Linking a Facebook Group

Through the Splitwise app, users will be given the option to link an existing facebook group to add members.

The Extension

Check the group’s recorded spendings, add your own bill and remind individuals to settle up transactions. All without having to leave Messenger.

Natural Language Interpretation

Recognized messages and phrases become entry points for users to quickly and easily add a bill into the Splitwise group.

Created and animated by Angus Lei

Original

Extension

For Splitwise to be integrated as a Facebook chat extension, we had to redesign the user interface of the main screen, taking out unnecessary elements, and cutting down to contain only the features that would be used in the context of a chat.

Curious? Let's talk!

afung94@gmail.com
/
Designed on Figma, developed on Webflow by Alexander Fung :)
ARTISTS I BASE MY PERSONALITY AROUND.
ARTISTS I BASE MY PERSONALITY AROUND.
ARTISTS I BASE MY PERSONALITY AROUND.
ARTISTS I BASE MY PERSONALITY AROUND.
ARTISTS I BASE MY PERSONALITY AROUND.
ARTISTS I BASE MY PERSONALITY AROUND.