Asset: Money Management
This is an individual UX/UI design course project at Brainstation. I worked independently on user research, personas, information architecture, sketching, wireframing, lo-fi & hi-fi prototype.
Duration: 10 weeks
Grade: 5/5
![UX design, app design](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/8fa88c1f-6fbc-422f-8b58-05a3638c1ba7_rw_3840.jpg?h=c23ad642cd557290457deb574d72ad21)
![UX design app project timeline](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/767ee3ec-af55-4967-a567-501902038d54_rw_3840.jpg?h=dd2e609f25bbfe345aa8da7188b02c55)
![UX design step 1: idea & objectives](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/4246aade-6695-4cf0-ac82-a55c0f47dbca_rw_3840.jpg?h=205e82b3c7694cb6a982b79ecaad0a98)
![UX design step 2: analysis & value proposition](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/d8f2b794-e8da-4b66-9fe6-1484bc8f0c0b_rw_3840.jpg?h=59868119aca512714c15e62fcefb9118)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/dba0f475-b52a-4993-8911-b9810a6c5c34_rw_3840.jpg?h=423ed95e399919087079a43f263162e9)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/12ec8edf-0f44-4362-b9da-9942d22e6c04_rw_1920.jpg?h=f10c17250a5b072f5746c75c26c129a7)
![UX design step 3: user interview](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/a60b3045-bbdd-4d7b-bd76-0f7a3f6a5e08_rw_3840.jpg?h=1126b156ccd78b00b3216ca0746fdbe3)
![user interview insights](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/cfc85173-02bb-44c2-993e-afc91216b724_rw_3840.jpg?h=9388f1de20ccd91d652cc267f9e05e75)
User Personas are created based on the 9 interviews that I conducted with friends & classmates. I summarized the responses into 3 groups:
The Product Owner (people who own many products like me)
The Starter (people who don't have many products but would like to start tracking their spending pattern,
The Bill Organizer (people who have many bill payees but currently having them saved on website, desktop, phone, etc.)
![UX design step 4: personas](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/93390cae-edcd-401d-924f-23883df135bb_rw_3840.jpg?h=d8ce3cd45fcf8781168b465cedc3aed0)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/9d705b2e-bcfb-41b4-8e24-f187f4b74243_rw_3840.jpg?h=f3f238cb93c41089a7574f253f380b9f)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/38c7210a-8c33-4052-8486-50482e106c85_rw_3840.jpg?h=02c43dfe851309df4fc51f61ba27ad06)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/ceb5fcaf-d4fa-4151-91a8-a884da1eeb4a_rw_3840.jpg?h=d41bea70487947137f50fbde5e0aef8b)
![UX design step 5: IA progression](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/c14beba4-682d-4255-ac5d-28c6dc612278_rw_3840.jpg?h=24e82ffa5580ac45bf44e5630d8386b6)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/1e747035-fbf2-412a-9bbc-d439a362692e_rw_3840.jpg?h=25a8c5815962c3d49c50ecbf1f79a511)
![UX design step 6: user flow](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/053ece84-a9aa-4634-b7fa-fec195e1db1c_rw_1920.jpg?h=8a4638f877c0f39ca844624dac92575e)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/5a8a8dfb-08c0-4b45-992d-c2bc7ca07426_rw_1920.jpg?h=8bd2fd99eaf5a728fc387bae13447714)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/a4dec2d3-ac74-47e9-b8cb-1e74c223792c_rw_1920.jpg?h=a5b8fcbdf0510d19e33507511c989827)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/44140e41-9e09-4cb4-a561-948f2b57845d_rw_1920.jpg?h=0b5b4d27423010565e67a2dbe1688126)
![UX design step 7: sketches & pop app](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/9dcdd685-1a91-41bf-bc18-49af05fa22ce_rw_3840.jpg?h=442f197de80a5b009fb826b9ab36a534)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/f2768621-3627-46d8-ad99-3981e583f6a1_rw_3840.jpg?h=b649b5261d67c8e6236e850cabf5b1b4)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/edd661c0-d553-4e4a-9eb9-5256eff3ff5b_rw_1920.png?h=be4593988d6f75af53696f2d854ac97f)
![UX design step 8: wireframes](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/d6a76c57-feb7-4a0b-93c9-742ad23291e9_rw_3840.jpg?h=7cabd72d20a695f2fd5e2f95c838575d)
Wireframe created by InVision.
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/c0fb8c1f-8578-4bdd-8c70-2365396de811_rw_1920.png?h=9decf0760797455dc00480a50757b589)
![UX design step 9: graphic style guide](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/d09ed33b-4048-4142-aa6d-9e3328ccddcb_rw_3840.jpg?h=b842abd1786fedde9de49e59aa891782)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/43c5c076-05c3-4a86-8a62-75332ef3fade_rw_1920.jpg?h=4f42bf30ae9a74b3c5503878c6fdea62)
![UX design step 10: onboarding & create account](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/d343e4fb-3dfd-4911-899a-e814a8fddca3_rw_3840.jpg?h=57b64e00bfa1607c17e174cd9206105e)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/9f9c3301-04dc-416e-b118-b3f0b77a454d_rw_3840.jpg?h=6043b2928247917873c5fb17af90f3fd)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/0d3ada35-a2d3-42c9-b3e8-9d3d7b80bc2b_rw_1920.jpg?h=763e59913faeba990290f0d693482722)
![UX design step 11: overview](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/f139cbc2-77b6-4d0a-8bd6-0daa74ebc620_rw_3840.jpg?h=bbc555d6b770affe6dc78f0434315700)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/e2c000f9-4095-4cdf-a8ed-cd4a02d25671_rw_1920.jpg?h=cd3635adcfebf8e183ea4c435bb902be)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/a12d314e-2a1b-427d-8429-04a4ced64eec_rw_1920.jpg?h=3455157f6d4a4390b2fa4c014b2b626d)
![UX design step 12: spending & saving](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/d68f8fae-5cd8-4427-b5bf-b969996e0db9_rw_3840.jpg?h=25f853627af7d1391cd3f20b198967d9)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/d8198560-844b-4937-9871-83409b65610e_rw_1920.jpg?h=fc4a13864d0a528f3faa8f3b40bc515b)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/6e3d750d-1dc5-42b3-ba13-a9fc61f337cd_rw_1920.jpg?h=840f191954cf25818903f32b6cb3423f)
![UX design step 13: organize bill payment](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/5630a3b1-1c84-4be3-a76c-fb395b7606de_rw_3840.jpg?h=cbce2bd44d298540f7eb9778d99d0921)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/082b9d36-45a8-425a-91b0-687238d88ddd_rw_1920.jpg?h=b34555c9c0cd1205160cf11c68f51203)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/e632bc8c-b030-4e7b-97b0-32b7feda1363_rw_1920.jpg?h=9844fe23cb3ae5de8fb6df129dd408cc)
![UX design step 14: other screens](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/c2d9a6b4-f99c-4178-ba53-299b93b302f8_rw_3840.jpg?h=b47487db326a1218f9d2336a7f30d0a6)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/7b5769d2-5704-4c12-94ea-f0db147aca02_rw_1920.jpg?h=337ac2a08cdfa5da87f04b0ecbeff79e)
![](https://cdn.myportfolio.com/c5604989699e4cb086404c04d25e495f/2f6353bb-f86c-4be4-bab1-c547cb9a0d66_rw_1920.jpg?h=a42eaa4ea5bec7bcb572c396efb3c011)
How is this app useful?
Imagine the scenario where you are in line at grocery store. You are trying to pay with credit card but can't remember which card has the highest reward for grocery.
You can then use this app and find out in the credit card page.
Imagine the scenario that your chequing account has a minimum balance required, or otherwise you will be charged a fee.
You can use this app to set up saving rules to remind you when to transfer more money to your account.
Imagine the scenario when you are trying to pay utility bills through apps with credit card. You are switching between different apps to double check the exact balance and trying to input the correct credit card number.
You can use this app to pay utility bills with just one tap, or set up alerts to remind you payment dates.
To see more about my UX Design course at Brainstation, also check out a travel app exercise that I did in class.