Concordia Capital
Concordia Capital
Case Study 1
Case Study 1
ENHANCING VISUAL ELEMENTS
homepage - before
homepage - before
homepage - after
homepage - after
SECTOR
SECTOR
timeline
timeline
TOOLS
TOOLS
Figma, Optimal Workshop, Wix
Figma, Optimal Workshop, Wix
2 months
2 months
Investment Banking
Investment Banking
Team
Team
SKILLS
SKILLS
Alone, entire project from redesigning to implementing on Wix
Alone, entire project from redesigning to implementing on Wix
Website UI, Mobile UI, Analysis, Research, Interview, Fidelity
Website UI, Mobile UI, Analysis, Research, Interview, Fidelity
project CHALLENGE
project CHALLENGE
- I face challenges with limited user feedback and restrictions on client data, which prevent personalized UX improvements
- The company prioritizes quality over attract new users --> Couldn’t do market research since most financial sites focus on getting new customers
- I work with a website built on Wix, which limits the changes I can make due to technical constraints
I face challenges with limited user feedback and restrictions on client data, which prevent personalized UX improvements
The company prioritizes quality over attract new users --> Couldn’t do market research since most financial sites focus on getting new customers
I work with a website built on Wix, which limits the changes I can make due to technical constraints
HOw i overcome
HOw i overcome
- Used evaluations, insights from other users, and data to guide decisions
- Kept layout clear, with a consistent structure and scannable text
- Made design simple to allow changes on Wix
Used evaluations, insights from other users, and data to guide decisions
Kept layout clear, with a consistent structure and scannable text
Made design simple to allow changes on Wix
goals: enhance visual elements
goals: enhance visual elements
Increase Professionalism and Trust
Optimize Information Presentation
Support Multi-Device Usage
Encourage interaction, while protecting client privacy by not showing transaction details or success stories
Redesign the layout to highlight important information, improving readability
Redesign the website and create mobile version
Pain Points: content, Navigation, Mobile Access
Pain Points: content, Navigation, Mobile Access
Overwhelming Content
Users find long paragraphs on Homepage and News/Insight pages difficult to digest, leading to information overload
Overwhelming Content
Users find long paragraphs on Homepage and News/Insight pages difficult to digest, leading to information overload
Insufficient Buttons
Users struggle to find specific information due to the lack of buttons
Insufficient Buttons
Users struggle to find specific information due to the lack of buttons
No Mobile Version
Users cannot access the site from mobile
No Mobile Version
Users cannot access the site from mobile
Success: Clicks & Content Interaction
Success: Clicks & Content Interaction
Trust and Professionalism
- 433% increase in Clicks to Contact shows that users are more willing to engage --> the redesign encourages users to take meaningful actions
Trust and Professionalism
433% increase in Clicks to Contact shows that users are more willing to engage --> the redesign encourages users to take meaningful actions
Layout improvements and Content optimization
- High increases in Unique Visitors, Sessions, and Page Views shows a growing interest in the site --> the redesign effectively draws attention and keeps users engaged
- High increases in Average Time on Page shows that users are finding the content more engaging and valuable --> the redesign improves content presentation and readability
Layout improvements and Content optimization
High increases in Unique Visitors, Sessions, and Page Views shows a growing interest in the site --> the redesign effectively draws attention and keeps users engaged
High increases in Average Time on Page shows that users are finding the content more engaging and valuable --> the redesign improves content presentation and readability
*Please note that the current website might look different from the version in my case study, as the company may have made changes after my internship ended.
discovery
clear navigation, needs mobile & visual improvements
Interviewed 6 users to understand their first impressions, navigation, content, and visual design
Sorted and visualized responses to spot trends and patterns
Used insights to identify user pain points
Decisions Based on the Data
Content Overhaul: Redesign paragraphs with bullets, subheadings, and visuals
Mobile-Friendly Redesign: Develop a responsive version of the site to engage a broader audience
Branding Improvements: Enhance visuals and unique design elements to make the site stand out
Navigation Tweaks: Improve interactivity by making logos clickable and optimizing the navigation bar
Heuristic Evaluation
Visual Design
The large logo unbalances the navigation
'Firm Overview' is repeated on the homepage
Missing images/icons slow down info access
Uniform text size makes long sections overwhelming
Links and URLs
One email link is broken, and the other is missing letters
Some page links lead to the wrong places or lack easy navigation back
Wrong URLs
Layout Issues
Different margins across pages make the site look uneven
Navigation bar titles don’t update when switching pages, confusing users
'Unique Mandate' section is hard to read due to cramped layout and dense text
Flow and Interaction
There's no button to jump to other Team bios after reading a bio
News sections aren't fully clickable
feature analysis: Content, Engagement & Navigation
Homepage Dominance
Receives the most traffic --> Optimize visual appeal and balance design
Low Traffic on News/Insights and Advisory Pages
Limited views, aligning with the heuristic findings of overwhelming content and poor readability --> Breaking down content using bullets, visuals, and subheadings to make information digestible and increase engagement
High Bounce Rate on News/Insights and Team Bio Pages
This supports the heuristic results indicating dense paragraphs and lack of visual aids --> Add visuals and interactive elements to these sections to retain users and improve time on page
Cross-Linking for Low-Traffic Pages
The heuristic evaluation flagged navigation issues, like non-clickable elements and missing links --> Cross-linking is proposed to create a more seamless flow between pages, boosting visibility for underperforming sections
The card sorting method indicated that users are satisfied with the current information hierarchy, confirming that the user flow is already straightforward and simple, and does not require changes.
Solutions: Trust, Usability, and imternal traffic
Increase User Trust
Simplify content, add visuals, and enhance navigation for clarity and professionalism
Enhance Professionalism
Balance visuals and improve text hierarchy to create a polished, trustworthy brand image
Enhance Usability
Fix links, optimize content display, and ensure mobile accessibility
Greater Visibility for Low-Traffic Pages
Instead of using buttons to promote services (business focuses on customer quality in stead of quantity) --> the homepage will include buttons linking to other pages
The company focuses on specific customers and values quality over quantity, unlike other banks. So I created a moodboard to understand the company's vision instead of conducting traditional market research.
moodboard
I developed 8 different visual options, which was challenging because the company wanted minimal changes to the existing visuals. The CEO selected this option that best matched his preferences.
SOLUTIONS
*Please note that the current website might look different from the version in my case study, as the company may have made changes after my internship ended.
Design System
Aa
Aa
#0F52BA
#008E75
AAA 9.56:1
AAA 13.23:1
Helvetica
Times New Roman
The company wanted simplicity, so I chose Times New Roman for the header font to convey professionalism and trustworthiness, and Helvetica body font, which ensures readability and a clean, modern look
I chose blue as the primary color (company color) and cold grey as the secondary color to add a modern, refreshing contrast, replacing the old warm grey that felt outdated and dull
I chose simple rectangular buttons with sharp edges for a clean, professional look, using two primary buttons for key actions and one secondary button to maintain a clear hierarchy and consistent user flow
Since the main focus is on the visuals, and both the flow and information hierarchy are already effective, I will focus solely on creating high-fidelity prototypes to enhance the visuals.
High fidelity prototype
*The current website might look different from the version in my case study, as the company may have made changes after my internship ended.
I developed the mobile version of the site based on the existing web design. Since the company uses Wix to manage the website, the options and layouts are quite limited. To work within Wix's constraints, I focused on creating a clean, responsive layout by simplifying elements and prioritizing essential features. The trade-off was that I could only perform basic customization and interactions for both the web and mobile designs.
take aways
Platform Limitations
Working within the constraints of Wix taught me the importance of understanding and adapting to specific platform limitations in web development.
Industry and Company Constraints
I learnt the importance of balancing creative design with industry regulations and company preferences limited the scope of changes I could implement.
Client Access Limitation
I couldn't get in touch with the real clients, so I used alternative users to identify pain points. This taught me to rely on feature analysis, information hierarchy, and data to support my research.
THANK YOU FOR YOUR VISIT
 Please check out my    and        for more.
© 2024 PORTFOLIO
by anH V LE