TD M YSP END A P P ASSIGNMENT 1: REDESIGN AN APPLICATION
PR O CES S B O O K
ELICIA HAN INTERACTION CORE STUDIO 201
CU RR E N T A P P TD Myspend is an app that let you instantly know where your money goes, it helps you to stay on top of your spending. For the best TD MySpend experience, download the TD Canada app for iPhone. TD MySpend App helps you keep track of your money so you can improve your spending habits.
PR OB L E M
#1
No customized budget or saving goal functions featureed I did my research by interviewing people in TD bank and by looking at the reviews in App store. It is pretty interesting that people either really like it or hate it. The people who dislike the app usually have three main concerns, these are the list down of the problems.
reviews from app store
PR OB L E M reviews from app store
INTERVIEWEE #4 “I find the app had inaccurate trackings several times, and the transaction dates are so small that I’m often confused when I spent the money.”
#2
Confusing transaction dates and monthly conparsion.
PR OB L E M INTERVIEWEE #2 “Too many information and functions on the same page.” INTERVIEWEE #7 “Lots of repetitive information and pages.”
#3
Repitive pages and information and cworded interface
PE R S O NA
I created these personas that are based on my interviewees and the people around me that are using the app. The three personas are divided into three generations and different cultural background. The first persona is that most common user I found during my research which is the younger generation that is depended on technology.
ALICIE JOHNSON Alice grew up in Ontario and now she studies at UBC, she loves to spend time with her friends in bars or theatres, on the vacation, she goes back to her hometown and enjoys the time with her family. Alice has a part-time job in a cafe, and has a student loan to afford the rent and tuition.
“
GOALS
I am an active person, enjoy interaction with friends and family, I am also an individual who takes care of herself and is responsible for her own spending.
NAME// AGE//
Alice Johnson 20
PERSONALITY
O C C U PAT I O N / / S TAT U S / /
“
easy access to overview the financial status keeping track of the income and expense be able to set personal budget
F U S T R AT I O N S cofusing APP layouts and interface switching between different APP to get the job done
student extrovert
introvert
sensing
intuition
thinking
feeling
judging
perceiving
singal
L O C AT I O N / / ARCHETYPE//
V a n c o u v e r, B C advocate
#1 A universtiy student who is struggling to view her detailed transaction and setting up her own budget and saving goal.
E M PAT H Y MA P WHO ARE YOU EMPATHIZING WITH?
GOAL
Alice grew up in Ontario and now she studies at UBC, she loves to spend time with her friends in bars or theatres, on the vacation, she goes back to her hometwon and enjoy the time with her family. Alice has a part-time job in a cafe, and has student loan to afford the rent and tuition.
FOR PERSONA #1 I created this empathy in order to fully understand and project what the Alice think, see, listen and do in a regular bases.
WHAT DO THEY NEED TO DO? Alice needs to pay attentions on her study at UBC and also her job in the cafe. She will needs to save money to pay for her living, tuition, rent and also her student loan in the future. Since Alice is a interactive person that cares about friends and family, she also needs to spend time and effort with them.
WHAT DO THEY THINK AND FEEL? PAINS GAINS - financial issues - coaching for the manager - assignments
- school grades - trip back to her hometown - relationships
WHAT DO THEY SEE? Alice see her classmates and friends on campus and see the customers in the cafe she works. During the weekends, she see the nature during her hicking on the mountain and the books that she are preparing for the assignments and tests.
WHAT DO THEY HEAR? Alicie listen to the lectures in school and complains of life from her customers. She loves to listen to music during her transit to school and her friends’ life. When she talks to her parents, she will listen the things that happened to her family and her hometown.
WHAT DO THEY SAY? MOTIVATIONS - social - power - achievemaents
WHAT DO THEY DO? Alice goes to school in the morning and go working right after it, she usually spend her weekday night watching Netflix and doing assignments. During the weekends, she hangs out with her friends hiking, watching movie or drinking in a bar. During vacation, Alice fly back to Ontario and spend time with her family.
Since Alice is an interactive person, she discuss and share opitions during class, she loves to complain about her work life and gossiping with her friends. During work, Alice is a loving server that chat with her customers. She talk to her parents once a week to share her life in Vancouver.
PE R S O NA
The second persona is based on the middle-aged generation which is familiar with technology but not an expert. For this persona, I also target on Vancouver’s immigrant society, which lots of immigrants cannot fully understand advance English.
NICOLE WANG Nicole and her children emigrated to Toronto from China two years ago. Her English is not fluent but she enjoys the interaction with her neighbors and friends. Her children go to the school in the neighborhood and her husband stays in China for his career.
“
GOALS
Although I am far away from home, I enjoy the new environment here in Toronto. Since I am a housewife that need to take care of my two kids, I need to be careful with my spending.
NAME// AGE//
AN li iccoel eJ oWhannsgo n 24 08
PERSONALITY
O C C U PAT I O N / / S TAT U S / /
“
quick and safe money transfer tool multile languages options clear overview of the transaction’s date
F U S T R AT I O N S not understanding high-level English not understanding the sign botton
sHtouudseenwt i f e extrovert
introvert
sensing
intuition
thinking
feeling
judging
perceiving
married
L O C AT I O N / / ARCHETYPE//
VT ao nr oc on ut ov e r , B C aCdavr oe cgai tv ee r
#2 A new immigrant mom who cound not fully understand the information in the app
EM PAT H Y MA P WHO ARE YOU EMPATHIZING WITH?
GOAL
Nicole and her children emigranted to Toronto from China two years ago. Her English is not fluent but she enjoys the interaction with her neighbours and friends. Her children go to the school in the neighbourhood and her husband stays in China for his career.
FOR PERSONA #2 I created this empathy in order to fully understand and project what the Nicole think, see, listen and do in a regular bases.
WHAT DO THEY NEED TO DO? Nicole will needs to adapt the envirenment in Toronto, and will to learn better English. She needs to take good care of her children when her husband is not in Canada.
WHAT DO THEY THINK AND FEEL? PAINS GAINS - board - her long-distance relationship with her husband - childern’s grade
- shopping - learning good English - childern have good school life
WHAT DO THEY SEE? The most places Nicole will see during the day will be her home, the classroom she studies English and the mall for shopping. She also sees the view when she is driving around the city. Sometime, she will see her friends during brunch and shopping.
WHAT DO THEY HEAR? Nicole hears about her kids complain about school also friends’ complains about family and relationship. She listens to the lecture in her English class and listen to her husband’s life update and news happens in China.
WHAT DO THEY SAY? MOTIVATIONS - financial issues - coaching for the manager - assignments
WHAT DO THEY DO? Nicole does most of the housework by herself since her husband doesn’t live with the family. She cooks, clean and also shop in the mall for groceries. She goes to English class twice a week in the morning and sometime hang out with her friends and neighbours for lunch.
Nicole is a thoughful and sweet mom, she chat abuot school life with her kids often but she also prattle sometime. She participate in the classroom and chat with her friends quit often on phone as well. She usually calls her husband everyday and chat about daily life and kid’s situation.
PE R S O NA
This persona is targeted at the older generation who is new but interested in technology. However, lots of apps (include TD Myspend app) have small text and advance sign, which is not user-friendly for people who aren’t familiar with digital devices.
john craig John is a local resident in Vancouver, he had worked as a construction manager in his middle-aged, now he has retired from work so he can not only spend more time with his wife, children, and grandchildren but also enjoy his life. John is new to technology and apps and his wife are planning to move to a smaller house since they want to travel and their children no longer live with them.
“
GOALS
I’ve always wanted to travel around the country, now I finally retired from work, I will love to spend more time with my family and go to different cities with my wife.
NAME// AGE//
AJ loihc ne CJ ro ah ings o n 26 05
PERSONALITY
O C C U PAT I O N / / S TAT U S / /
“
accessible interface for elders clear interface for starters featuring saving goal function
F U S T R AT I O N S not able to see the small text and signs small button which is not ideal for big fingers. confusing symbolic signs
sr teut di reendt extrovert
introvert
sensing
intuition
thinking
feeling
judging
perceiving
married
L O C AT I O N / / ARCHETYPE//
VV aa nn cc oo uu vv ee rr, B C ae dx vpol oc ar et er
#3 A old men who is new to technology and is struggling to read the small signs and text
EM PAT H Y MA P GOAL
WHO ARE YOU EMPATHIZING WITH? John is a local resident in Vancouver, he had worked as a construction manager in his middle-aged, now he has retired from work so he can not only spend more time with his wife, children, and grandchildren but also enjoy his life. John is new to technology and apps and his wife are planning to move to a smaller house since they want to travel and their children no longer live with them.
FOR PERSONA #3 I created this empathy in order to fully understand and project what the John think, see, listen and do in a regular bases.
WHAT DO THEY NEED TO DO? John will need to sell his house in order to buy a smaller one and for traveling. He will learn how to buy plain tickets online and how to track his finance on the app.
WHAT DO THEY THINK AND FEEL? PAINS GAINS - health (eye sight) - salling their house
- grandchildren - traveling - stable and fexible life
WHAT DO THEY SEE? John usually sees the trees the lake when he is walking in the morning, he then will see the local news on the TV with his wife. When John is on vacation, he enjoys looking at different cultures and the city view.
WHAT DO THEY HEAR? John listen to the local radio during his walk in the morning, he also listens to his wife’s naggy quit often. He listen to his children’s life update when he call them and he also listen to his grandchildren’s laughters.
WHAT DO THEY SAY? MOTIVATIONS - incentive - achivement - growth
WHAT DO THEY DO? John usually wake up early in the morning for a walk in his neighbourhood. He sometimes goes to his fravorite grill place for breakfast, however he usually share the meal with his wife at home. In the afternoon, he either goes fishing or reading books. On his vacation, John enjoys more of a relaxing schedule such as hiking or touring in the city.
John is not a talkative person, the person he talk the most is his famly. He loves to share his work experiences and knowledge with his wife, he sometime jokes to his children he enjoys chatting with his grandchildern.
COMPARATIVE COMPETITIVE ANAYLSIS
#1
RBC Mobile APP In order to fully understand the problem and improvement of TD Myspend app, I compare it with the RBC Mobile app, which has the same purpose and similar functions. By comparing both, I found lots of faults for the redesigned app that I haven’t thought of yet.
PROS
RBC mobile app makes money management easier with NOMI In sights and NOMI Find & Save. You told us it was time to refresh our app, and we heard you. We’re excited to bring you a new design that uses the Apple technology you’re used to, so it fit more easly into your life
- pleasing and clear interface and information - current balance display clearly on the home page - detailed description for sigal transaction - featuring review option for every transaction - the banking app and the tracking app is combained - featuring saving gaols and average saving function - featuring Apple Siri for easier access - menu and catalog display in the down bar when ever needed
CONS - security issues - doesn’t show how close or ever you are with the budget - no language options
COMPARATIVE COMPETITIVE ANAYLSIS
#1
RBC Mobile APP S.W.O.T. To further anaylsis the comparative competitive, I made the S.W.O.T. for a quicker and easier understanding.
COMPARATIVE COMPETITIVE ANAYLSIS
#2
Daily Budget APP
In order to fully understand the problem and improvement of TD Myspend app, I compare it with the daily Budget app, which doesn’t cannot with the cards but has the same tracking and analyzing functions. By comparing both, I have a better understanding of what interface and experience are more friendly for users.
PROS - very clear and organize interface - high accessibility for any kind of user - lots of graphic and signs to provide quiker overview - good catalog tag system for organization - customize setting for tags, budgets and reminder
CONS Daily Buget app is a rated 5 star app that is loved by thousands of users! Unlike traditional complicated budgeting apps, Daily Budget Original focuses on being simple, easy and actually fun to use.
- does not tied with you credit or debit cards - security issue: no password needed - limited access to featured function unless you buy the Pro version app
COMPARATIVE COMPETITIVE ANAYLSIS
#1
RBC Mobile APP S.W.O.T. To further anaylsis the comparative competitive, I made the S.W.O.T. for a quicker and easier understanding.
UUSER S E RFLOW F LOW
( ORIG INAL)
current app
TD MYSPEND
log in page
forget password
In order to have a better understanding of the real UX problems in TD Myspend app, I created this user flow to analyze the flow of the app. I found that there are lots of repetitive information and pages that are not necessary.
reset password
home
catalog log out spending insight
monthy path
spending by category
spending history overview monthly options
current option
spending history
all spending by category
daily spending summary
daily spending detail
WHATS
spendt yesterday
monthly spending budget chart
(unecessary spending) typical option
money path
daily digest
daily spending vs
WHATS spending detail
mothly tipical
NEEDS
yearly spending budget chart
(necessary spending) overview
spending by category
NEEDS spending detail path category
daily digest spending history spending spikes
current month
transaction history
accounts
categories
dates
peferences active accounts
real time notificaitons
daily digest notificaitons
enabled/disabled
UUSER S E RFLOW F LOW
(REDESIGNED)
redesigned app
TD MYSPEND
log in page
forget password
For my redesigned app, I decided to take off all of the “spending history� section, and renew the navigation bar, which will serve an easier, friendly and clear UX and UI for the user. I also added the customized fuctions (budget and saving gaol settings) and the language option.
reset password
home current budget
catalog log out spending insight
monthy path
spending by category
spending history overview monthly options
personal budget setting
daily digest
current option
saving goal setting
spending history
all spending by category
daily spending detail
daily spending detail
WHATS
monthly spend
monthly spending budget chart
(unecessary spending) typical option
money path
auto budget setting
daily spending vs
WHATS spending detail
mothly tipical
NEEDS
yearly spending budget chart
(necessary spending)
spending by category
NEEDS spending detail
daily digest spending history spending spikes transaction history
accounts
categories
dates
languages
peferences active accounts enabled/disabled
PA PE R WI REFRA ME I started creating the wireframe on the paper cards, which is easy to test in person and quicker to edit. I first drew sketches on the cards and tested on my classmate, after a couple tries and errors, I finally lined it out with ick.
CL I CK ABLE W I REF RA ME URL: https://projects.invisionapp.com/d/main#/projects/prototypes/13198761 After I have decided my wireframe, I then moved to the digital version by creating this in Illustrator and work it in InVision for clickable function in order for me to see how it actually work in a digital device.
CL I CK ABLE W I REF RA ME URL: https://projects.invisionapp.com/d/main#/projects/prototypes/13198761
M O OD B OA RD
Since I am redesigning for a company that has a certain brand color, I use the deep green that was already been used in the current TD Myspend app. However, I want to reduce the green by using line illustrator and graphics so the interface is cleaning and more pleasing to look at.
MOCKUP
This is my final mockup for my redesigned TD Myspend app, I added the customized functions (saving goal) in the interface. I also make the bottom, date, and spending amount bigger. The overall Interface is bright, clear and easy to use.
TD MYSPEND
MONTHLY PATH
MONTHLY SPENDING
FEB
FEBUARY 22, 2018
$ 1000
$ 500
$672 SPENT SO FAR
$100
$128
1
15
30
BELOW YOUR $800 BUDGET
SAVED $300 INCOME $1100 EXPEND $672
SPENDING DETAILS
22 / FEB
SHOPPERS DRUG MART
/ FEB
21 / FEB
RENT
/ FEB
21 / FEB
ESSO GAS STATION
/ FEB
TD REWARD CREDIT CART
TD DEBET CARD
TD REWARD CREDIT CARD
$
$
62
800
$
70