Wealth Magik
Enhancing the cross-platform experience to help retail investors with their portfolio.
In 2020, I helped WealthMagik, a FinTech company that provides investment data, with three projects that culminated in the redesign of two websites and launch of one new app for a better on-the-go experience.
Due to NDA restrictions there are certain details to this project that I still cannot disclose. Please contact me for more information at tolarnsakul@gmail.com
Role
UX Designer
Employer
Ahancer UI/UX Agency
Timeline
Jan - Dec 2020
my contribution
Research, Strategy, Design
Final Experience
1. Wealth Magik App
Get a quick X-Ray into any mutual fund's data, from performance metrics to management fees.
Quickly access historical performance, risk profile, asset allocation, and dividend payouts. The fund tier pyramid visualization shows how your fund compares to its peers in terms of percentiles, providing valuable insights into its relative performance.
Enhance your decision-making by comparing between many mutual funds side by side
In the Fund Screener tab you can quickly compare different funds and evaluate their performance relative to each other to gain a comprehensive understanding of how they differ.
Stay informed about your portfolio's performance across diverse asset classes with real-time data updates.
Construct your portfolio by inputting funds based on historical transactions or current holdings' present-day values. For multiple portfolios, access a consolidated overview to evaluate your overall performance and asset allocations.
Evaluate individual funds or your entire portfolio’s performance with meaningful benchmarks.
Quickly assess how your portfolio or individual funds perform compared to relevant industry benchmarks. Gain deeper insights by comparing each fund to a suitable reference point, or analyze your whole portfolio against a benchmark with a similar weighted return profile.
2. Wealth Magik Web
Effortlessly access your entire financial portfolio and the information that matters most, all in one unified dashboard.
Navigate detailed fund information seamlessly, with clear layouts and guided navigation for quick, confident decision-making.
Supercharge your investment strategy by instantly comparing funds side by side, revealing insights with just a single click.
Explore bonds smoothly with an intuitive browsing experience that highlights the best options and smart recommendations.
3. WealthMagik Service Dashboard
Start building your portfolio by adding your investments.
Create a portfolio for mutual funds, stocks, or bonds. Similar to the process in the WealthMagik app, add funds by inputting historical transactions or current holdings' present-day values, and access a comprehensive portfolio overview in the dashboard.
Monitor portfolio drift to know when to rebalance.
Gain insight into your portfolio by tracking performance across asset types to see if you have too much or little exposure. Stay informed on when to rebalance, by tracking your portfolio drift based on your ideal allocation (choose from presets or customize as desired).
Keep tabs on the essential details of your individual funds, all the way to the bigger picture of your portfolio performance.
Access key portfolio details in the side panel, including Transactions and Dividends. Review specific fund data, such as past buy/sell orders and accrued dividends. Utilize the benchmark page to assess both individual fund and overall portfolio performance.
Streamline your investment management with the consolidated view.
Obtain a comprehensive overview of all your investment portfolios in one consolidated view. Toggle between brokerages, asset classes, and portfolio owners view, while staying informed about corporate actions and tracking your investment goals.
How we got here
Our project goals focused on creating a unified and seamless cross-platform user experience for WealthMagik and WealthMagik Service.
WealthMagik is a leading wealth management platform in Thailand that provides financial information to the everyday investor.
Launched in 2012, WealthMagik offers comprehensive data on investments like Mutual Funds to retail investors (non-professionals). The company has three products in its ecosystem that focuses on Investment Data, Financial Planning, and Mutual Fund Trading.
Our objectives were to centered around creating a unified cross-platform experience for WealthMagik products
Ideating on app structure
.For the WealthMagik app, our team explored various screen configurations and layout that prioritized different jobs-to-be done such as browsing, comparing, or tracking.
The Portfolio First Approach
This wireframe concept places the Portfolio at the forefront, ensuring that when users open the app, they have a direct view into its performance, along with easy access to optimization tools, search, and ranking features in the sticky bottom navigation.
The Discovery First Approach
This wireframe concept's home screen enhances the discovery of fund types and facilitates tracking favorites through the watchlist feature. Although the portfolio is accessible in the fourth sticky navigation tab, it occupies a less prominent position.
Defining the new UI theme and visual language
We created a unified design system for WealthMagik that balances playfulness with functionality for complex financial data. The design evokes an organized, intuitive space through generous white space, soft curves, and a monochromatic blue palette accented with colorful flat graphics.
UI Theme Exploration
We experimented on the WealthMagik Service portfolio dashboard page to fine-tune our color palette, testing various color combinations and stress testing it.
Visualizing the new design
Applying the theme to the mobile app was a key priority. The mockup below demonstrates the new theme on the WealthMagik portfolio page. We explored using gradients to accentuate data, but ultimately removed them to maintain a clean aesthetic and improve readability.
Ensuring color accessibility
Color is a key carrier of financial data in our UI, so we built an accessible palette to be distinguishable for users with color vision deficiency. The simulations below verify that our light and dark themes maintain clarity for these users.
