Redesigning Société Générale's dashboards
The objective of this case study is to propose a new, modern, and elegant design for Société Générale's two dashboards while aligning with the company's branding guidelines. This redesign aims to enhance the user experience by addressing identified issues, improving visual consistency, and ensuring clarity and accessibility.
I decided to follow steps of the Design Thinking Process to answer to this case study.
EMPATHIZE & DEFINE
Existing dashboards
During the audit phase, several key issues were identified within Société Générale's existing dashboards:
Dashboard audit
Design and visual consistency:
The lack of white spaces led to high information density, making the interface appear cluttered. Additionally, the presence of right angles throughout the interface contributed to a rigid and outdated appearance.
Interface organization:
The layout lacked clear logic, with inconsistent reading orders and accessibility challenges due to less intuitive content placement.
Navigation system:
Filters were scattered and poorly arranged, compromising usability. The slide system for filters was deemed unsuitable, further hindering accessibility.
Information hierarchy:
The tab order lacked coherence, and titles showed inconsistency in style and presentation. Graph readability was suboptimal, and data reliability issues were present.
Language and terminology:
Confusing language and potentially ambiguous terminology were observed, impacting user understanding.
Société Générale Branding analysis:
A thorough analysis of Société Générale's branding guidelines revealed key elements that should be integrated into the dashboard redesign:
Typography: Montserrat font (extra bold, 40px) for titles and Source Sans Pro for other text.
Colors: Blue (#010035) and Red (#E2010B).
Problem Statement
To create dashboards that reflect Société Générale's branding, prioritize readability, and eliminate ambiguity while addressing identified usability issues.
IDEATE
Extensive research was conducted on existing dashboards from platforms such as Dribbble, Behance, and Pinterest to gather inspiration and benchmark against best practices.
Dashboard inspirations:
Sketches & low-fidelity prototype:
Initial sketches were created on paper to explore various design concepts and visualize potential solutions to the identified issues.
PROTOTYPE
Mid-fidelity prototype
Based on the sketches and research insights, a mid-fidelity prototype was developed with the following key features:
Introduction of rounded elements for a modern aesthetic.
Centralization of filters for improved clarity and ease of use.
Implementation of a logical card arrangement following a Z-pattern layout to enhance comprehension.
Establishment of an information hierarchy using opacity/transparency and font weights.
Harmonization of diagram colors with Société Générale branding.
Integration of white spaces and light mode for content lightening and improved readability.
High-fidelity prototype
The mid-fidelity prototype was refined into a high-fidelity version, incorporating polished design elements, consistent typography, color schemes, and ensuring responsiveness across different screen sizes.
Before / After
Screen 1:
Screen 2:
NEXT STEPS
Usability testing
To evaluate the effectiveness of the redesigned dashboards, comprehensive usability testing will be conducted. This involves gathering feedback from users to identify any remaining pain points or areas for improvement. Testing scenarios will be carefully designed to cover different user interactions and usage contexts.
Desirability testing
Beyond usability, desirability testing will be performed to evaluate user perceptions and preferences. This step ensures that the final design resonates with the target audience and meets their needs effectively. By understanding user attitudes and emotional responses, adjustments can be made to enhance user satisfaction and engagement.
Further iteration and refinement
Based on the feedback gathered from usability and desirability testing, iterative improvements will be made to the dashboard design. This may involve refining specific features, adjusting visual elements, or revising interaction patterns to better align with user expectations and business objectives.
CONCLUSION
Through this comprehensive UX/UI case study, a strategic plan for the redesign of Société Générale's dashboards has been outlined. By addressing identified usability issues, adhering to branding guidelines, and incorporating modern design principles, the proposed solution aims to significantly enhance the user experience and effectiveness of the dashboards. Further testing and refinement will ensure that the final product aligns with both user expectations and business objectives.