dyani Catori logo
home icon
Home
case study icon
Case Studies
designer avatar icon
The Designer
music icon
unclickable Figma logo
Figma
unclickable dribbble logo
Dribbble
unclickable linkedin logo
LinkedIn
unclickable adobe illustrator logo
Ai
https://www.dyani.design/portfolio/home

I
TRANSFORM

Chaos

into

Clarity

Simplicity

Creativity

Insight

I design for neurodivergent minds, like mine.

I think in parallel.
Multiple ideas, multiple tabs, always in motion, always with a good song.
My portfolio reflects that.
Welcome to my brain.
Chaos, confusion, the breakdown that leaves them feeling a million miles away.
So we question what's there. Remove what isn't needed.
And shape what remains. Suddenly..
Clarity isn't so far away.
And the rest? Well that lives in the work.
email icon
resume icon
linkedin icon
The work continues...
https://www.dyani.design/home
https://www.dyani.design/portfolio/casestuidies
Digital Designs                        Physical Product Designs    
Kid Commerce
One Pay
Organizational Home Hub
Budget like a Boss, Babe
This is a condensed mobile version. Full case study and prototypes are available on desktop.
Mockup prototype of an original design for an app that gamifies financial literacy for youth

Kid Commerce

An app to gamify financial literacy for youth

My role:

Designer, UX Researcher, and Project Manager

Ongoing timeline

< This is a prototype!

Mockup prototype of an original design for an app that gamifies financial literacy for youth
curved left arrow
I am a
prototype!

Kid Commerce

An app to gamify financial literacy for youth

My role:

Designer, UX Researcher, and Project Manager

Ongoing timeline

How can we design an engaging user experience that simultaneously appeals to parents seeking to build generational wealth through financial education for their children AND encourages children to learn financial literacy through gamified experiences?

scroll to top arrow

Process for Kid Commerce

Summary:

Design a versatile web app capable of appealing to a wide demographic of parents and children of all ages. Ensure that the platform offers engaging and age-appropriate content for children to acquire financial literacy skills and foster financial independence through interactive games, simulations, and community -orientated activities.
Design a versatile platform for parents and kids that makes financial literacy engaging and age-appropriate with interactive games, simulations, and community activities.

Objectives:

- Approach the challenge with a dual user-centered design mindset to ensure that the website addresses the specific needs of both parents and children.
- Demonstrate the use of effective responsive patterns to guarantee that the website functions seamlessly and provides a consistent experience.
- Assess accessibility support across devices for an inclusive user experience.
- Approach the challenge with a dual user-centered design mindset to ensure that the website addresses the specific needs of both parents and children.
- Demonstrate the use of effective responsive patterns to guarantee that the website functions seamlessly and provides a consistent experience.
- Assess accessibility support across devices for an inclusive user experience.

Research

Design Tensions

1. Designing an interface that appeals to both parents and children of varying ages
Designing a single experience for parents and children 5-17 creates conflicting needs around visual language, interaction patterns, and motivation.

2. Age appropriate content and comprehension
Financial concepts need to center users' developmental stages without oversimplifying or overwhelming them.
‍
3. Building trust with parents and retaining interest with children
Parents need transparency and control, while children need motivation and relevance.
Designing a single experience for parents and children 5-17 creates conflicting needs around visual language, interaction patterns, and motivation.

Financial concepts need to center users' developmental stages without oversimplifying or overwhelming them.
‍
Parents need transparency and control, while children need motivation and relevance.

Discovery

*Note: This research reflects my thinking at the time of this project.
The discovery phase revealed that a single design would not adequately address the diverse needs of our user base. Consequently, I have chosen to develop a parent-oriented homepage designed to attract parents to our service, complemented by distinct portals and pages tailored to different age demographics. This approach essentially entails the creation of multiple user-centered websites housed within one unified platform.
The discovery phase revealed that a single design would not adequately address the diverse needs of our user base. Consequently, I have chosen to develop a parent-oriented homepage designed to attract parents to our service, complemented by distinct portals and pages tailored to different age demographics. This approach essentially entails the creation of multiple user-centered websites housed within one unified platform.
See full research details here

What the Research Told Me

Clearing the design tensions:
‍
1. A single interface cannot effectively support children and parents without creating friction for one or both groups.

2. Financial literacy comprehension needs to adapt to user development.
‍
3. Trust for parents depend on transparency and easy access to information. Engagement for children depend on engaging, familiar, and interesting content.
1. A single interface cannot effectively support children and parents without creating friction for one or both groups.

2. Financial literacy comprehension needs to adapt to user development.
‍
3. Trust for parents depend on transparency and easy access to information. Engagement for children depend on engaging, familiar, and interesting content.

So..

How can we create a user-centric website structure that accommodates the diverse needs of our various audiences while ensuring swift loading times, optimal responsiveness, and numerous multifaceted and compelling content?

Inside My Design Thinking

Sketches and Wireframes

These sketches show my internal design dialogue with all the questions, doubts, and pivots that shaped the final solution.
" How can I make the homepage appeal to both parents and children? Do I NEED to have a single homepage? "
" How can I make the homepage appeal to both parents and children? Do I NEED to have a single homepage? "
" I will focus on the parents who will be subscribing on behalf of the kids. With a unique service, it needs a unique homepage. "
" I will focus on the parents who will be subscribing on behalf of the kids. With a unique service, it needs a unique homepage. "
" Not bad but still pretty stiff. I can do better, it'll come to me."
" Not bad but still pretty stiff. I can do better, it'll come to me."
These sketches and wireframes clarified the product's core structure, logic, and tone. They revealed the need for age-specific portals that balance clarity for parents with engagement for kids.
The sketches and wireframes clarified the product's core structure, logic, and tone. They revealed the need for age-specific portals that balance clarity for parents with engagement for kids.

Current Evolution

This project is ongoing. The screens shown in the prototype reflect the current design direction with additional flows evolving through continued research and iteration.
parent portal image
This project is ongoing. The screens shown in the prototype reflect the current design direction with additional flows evolving through continued research and iteration.

Switch to desktop to see the prototype.
mockup of a design for Kid Commerce
I am a prototype!
curved left arrow

Stay tuned...

https://www.dyani.design/kidcommerce
This is a condensed mobile version. Full case study and prototypes are available on desktop.
Mockup prototype of a redesigned app of OnePay banking app
I am a prototype!

OnePay

A banking app for saving and spending.

My role:

Designer, UX Researcher

2 week timeline

< This is a prototype!

Mockup prototype of a redesigned app of OnePay banking app
curved left arrow
I am a
prototype!

OnePay

A banking app for saving and spending.

My role:

Designer, UX Researcher

2 week timeline

How can we improve OnePay’s app to empower young adults in managing their finances, support saving and spending goals, and enhance their financial well-being?

scroll to top arrow

Process for OnePay

Summary:

Refine a UX known to be frustrating, starting with user research and ending with high-fidelity prototypes
Refine a UX known to be frustrating, starting with user research and ending with high-fidelity prototypes

Objectives:

- Approach the challenge with a user-centered design mindset
- Implement micro-interactions and animations to achieve a more intuitive design
- Evaluate the success of addressing user pain points and motivations
- Approach the challenge with a user-centered design mindset
- Implement micro-interactions and animations to achieve a more intuitive design
- Evaluate the success of addressing user pain points and motivations

The Original Design

a mockup screen of the home page of the original design of OnePay
a mockup screen of the checking account page of the original design of OnePay
a mockup screen of the savings account page of the original design of OnePay

Research

The Missed Opprtunities

1. Difficulty making credit line payments
Users struggled to quickly locate and complete credit line payments which increases the risk of missed or late payments.

2. Buried functionality of high-value features: recurring transfer
Important tools like scheduling recurring money transfers were buried, forcing users to search, create their own workaround, or abandon the task altogether.
‍
3. No visibility into spending behavior
Users lacked insights into spending trends which makes it difficult to plan, adjust habits, or set and keep realistic spending and saving goals.
1. Difficulty making credit line payments
Users struggled to quickly locate and complete credit line payments which increases the risk of missed or late payments.

2. Buried functionality of high-value features: recurring transfer
Important tools like scheduling recurring money transfers were buried, forcing users to search, create their own workaround, or abandon the task altogether.
‍
3. No visibility into spending behavior
Users lacked insights into spending trends which makes it difficult to plan, adjust habits, or set and keep realistic spending and saving goals.

Discovery

*Note: This research reflects my thinking at the time of this project. If I were to revisit this work today, I would refine them to be more data and behavior-driven.
The research findings indicate that a significant majority of users, approximately 80% of users, habitually seek data in familiar locations, such as the pie chart or homepage to identify trends.
The app's current navigation structure presents challenges due to concealed and inaccurately labeled sections. Within the initial 60 seconds of interaction, all five interviewees encountered difficulties locating specific tasks or areas.
The research findings indicate that a significant majority of users, approximately 80% of users, habitually seek data in familiar locations, such as the pie chart or homepage to identify trends.
The app's current navigation structure presents challenges due to concealed and inaccurately labeled sections. Within the initial 60 seconds of interaction, all five interviewees encountered difficulties locating specific tasks or areas.
See full research details here

What the Research Told Me

Within the first 60 seconds of interaction, users defaulted to their familiar behavior patterns and when their expectations were not met, task completion broke down, leaving some tasks never completed.

- Payments weren't discoverable. Users struggled to locate the credit line payments without trial and error.
- Recurring transfers felt hidden. Users didn't perceive this as a top feature.
- Spending insights were not available. All users looked for trends near the homepage or pie chart or search in transaction history.
Within the first 60 seconds of interaction, users defaulted to their familiar behavior patterns and when their expectations were not met, task completion broke down, leaving some tasks never completed.

- Payments weren't discoverable. Users struggled to locate the credit line payments without trial and error.
- Recurring transfers felt hidden. Users didn't perceive this as a top feature.
- Spending insights were not available. All users looked for trends near the homepage or pie chart or search in transaction history.

So..

How can we strategically integrate trend data and enhance navigational efficiency to address usability issues and enhance the overall user interface of the application?

Inside My Design Thinking

Sketches and Wireframes

These sketches show my internal design dialogue with all the questions, doubts, and pivots that shaped the final solution.
" I like the options on the homepage, but they are crowded. "
" This seems forced. What if I isolate the options and add the offers back? "
" How can I make this look better visually? What other graph types can I use? "
The sketches show my internal design dialogue with all the questions, doubts, and pivots that shaped the final solution.

Switch to desktop to see sketches and wireframes.

Final Outcome

image of a prototype screen for the redesign of OnePay
I am a prototype!
curved left arrow

I am a
prototype!

image of user interviews after the redesign
redesigned spending trends image
Switch to desktop to see the prototype.

My Retrospective

This project highlighted how strongly users lean on familiar ways of thinking about money when using new or complex systems. The redesign solved a lot of the "Where do I find this?" problems, but also revealed opportunities to further explore different layouts and prioritization approaches before landing on a final version.

I'd expand usability testing to better understand why certain behaviors surfaced, such as confusion between savings accounts and actionable options. These moments weren't about missing features, they pointed to opportunities to make intent and intuitiveness clearer.

Ultimately, this project reinforced that financial tools, especially for those still building financial independence, are most effective when they reduce decision fatigue by matching the way users already think about money rather than forcing them to adapt to how a system is built.
This project showed how strongly users rely on familiar mental models when navigating financial tools. The redesign improved discoverability and revealed opportunities to refine layout, clarity, and intent through deeper usability testing. Ultimately, aligning the interface with users' natural ways of thinking proved key to reducing decision fatigue.
https://www.dyani.design/onepay
email icon
resume icon
linkedin icon
The work continues...
https://www.dyani.design

I AM

DYANI

CATORI

I design for minds like mine,
the overwhelmed, disorganized, beautifully neuro-spicy minds.
​I make lives easier
‍
by making the things we interact with
more intuitive.
‍
With a background shaped by
resilience,
creativity,
and "thinking outside the bun",
I've learned that coloring outside the lines
often leads to better experiences,
especially for those of us who never really fit the mold.

Because sometimes you need
a little
‍chaos
to find the clarity.

email icon
resume icon
linkedin icon
The work continues...
https://www.dyani.design/designer
Royalty Free Music · Upbeat Hip Hop - No Copyright Music
https://www.dyani.design/music
email icon
resume icon
linkedin icon
The work continues...

Heading