We knew we had a challenge when Citi Group came to us with their Citi Velocity® Charting platform. Managing over a million data series daily, ensuring real-time accuracy, and making it all look seamless—that’s what we live for at Agory Design.
The Project: Simplifying the Complex
Citi Velocity® is no ordinary tool. It’s a platform that integrates data from various Citi products, allowing users to visualize and analyze vast amounts of information. Our mission? To revamp the experience, including crafting light and dark themes that could handle complex data visualization while keeping users’ eyes and workflows happy.
The Challenges: More Than Just Data
This project wasn’t just about data but about delivering an experience. Here’s what we tackled:
Data Complexity: Daily, over a million data series must be clear and usable.
Real-Time Accuracy: Users need minute-by-minute data fast.
Diverse User Needs: We had to design for everyone, from analysts to executives.
Visual Appeal: The interface had to be functional and easy on the eyes.
Stakeholder Harmony: We needed to keep everyone on the same page, from product owners to executives.
The Solutions: Research, Design, and a Dash of Fun
We approached this project with our usual mix of rigor and creativity:
User Research: We dug deep into user behaviors and workflows to design an experience that worked for everyone.
Stakeholder Engagement: Regular conversations with Citi’s team aligned us with their vision.
Designing Light and Dark Themes: We created two distinct themes that were functional and visually appealing.
Task-Focused Layouts: We simplified the UI to help users finish things quickly and efficiently.
The result? A charting app that’s intuitive, efficient, and loved by users. We saw a 95% user satisfaction rate and a 50% faster adoption rate—proof that thoughtful design pays off.
Designing Light and Dark Themes: Tips for Success
Creating light and dark themes for data-heavy apps is all about user experience. Here’s what we learned:
1. Avoid Pure Black (#000000): It’s harsh on the eyes. opt for a dark gray (#121212) for a softer, more user-friendly look.
2. Choose Legible Fonts: Clarity is key in dark mode. Stick to fonts that are easy to read and avoid ultra-thin styles.
3. Adjust Shadows and Elevation: In dark mode, use subtle glows or light borders to maintain depth without overwhelming users.
4. Avoid Saturated Colors: Bright colors can cause eye strain. Muted tones are easier on the eyes and more comfortable for long-term use.
5. Maintain Consistency: Ensure that your light and dark themes are in the same design family.
Wrapping Up
Working on Citi Velocity® was more than just a project—it was an experience. We learned a lot, had a great time, and ended up with a product we’re incredibly proud of. Designing with human factors in mind is about more than aesthetics; it’s about creating something that truly works for people. And at the end of the day, that’s what we’re all about at Agory Design.
Comments