Tools
Figma, Figjam
Task
Research
Interface design
Experience design
Team
1 Project Manager
1 Team-Lead
1 UI-Lead
1 Designer
1 User Researcher
1 External expert for stock
Timeline
6 Months
Handelsblatt Börse focuses on stock market-related news, analyses, and information, catering to individuals interested in financial markets, investment, and economic developments. It's a platform where readers can find information about stock prices, market trends, and other relevant financial data. The "Handelsblatt Börse" project is a comprehensive redesign initiative aimed at enhancing user engagement, maintaining consistent brand design, and improving overall user experience. The project follows a mobile-first approach, utilizing Handelsblatt's design system and brand library to ensure a cohesive and recognizable visual identity.
The design process is divided into six major steps:
1. Research
2. Information Collection
3. Information Architecture and Site Map Development
4. Low Fidelity Design
5. High Fidelity Design
6. User Testing
A comprehensive analysis of the existing Börse platform was conducted to distinguish its strengths and weaknesses. This inspection revealed key issues including inconsistent brand design, restricted visibility of valuable content due to large ad banners, and an uneven distribution of information on longer pages. To supplement this assessment, benchmarking activities were undertaken, and collaboration with external experts ensued to gain deep insights into the dynamics of the German stock market. This comprehensive strategy provided a solid basis for understanding the platform's complexity.
Old website: Homepage and Ticker page
The information collection phase involved gathering relevant data and insights from external experts, stakeholders, and competitors, serving as a foundational step to inform the design process. This incoperates an examination of market trends and innovative features present in competitor websites. Subsequently, the development of a clear information architecture and site map became crucial for guiding the design process. Ideas for the design were outlined based on the insights garnered during research, with a concerted effort to coordinate with external experts to ensure alignment with industry standards. This collaborative approach ensured that the subsequent design iterations were informed, strategic, and in harmony with prevailing industry norms.
Benchmarking
Information Architecture
User Flow
The creation of low-fidelity design prototypes played a pivotal role in visualizing and communicating the initial design concepts. Subsequently, feedback was actively sought from a diverse range of stakeholders, including external stock experts and senior designers. This collaborative approach proved instrumental in refining and enhancing the design, incorporating valuable insights from various perspectives to ensure a well-informed and polished final product.
Skecth
Low-Fidelity design
The refined low-fidelity designs were translated into high-fidelity prototypes, a process that involved leveraging Handelsblatt's design system and brand library. This strategic utilization ensured the maintenance of a consistent and easily recognizable brand identity throughout the design, contributing to a cohesive and impactful user experience.
New Börse design aligns with Handelsblatt design system and is fully responsive
Moderated user testing was conducted with the support of an in-house user researcher, employing a responsive prototype to systematically collect valuable user feedback and insights. This iterative process allowed for the incorporation of user suggestions and preferences, ensuring that the final design aligns seamlessly with user expectations.
With the project currently under development, the iterative and user-centric approach ensures that the final product will not only address the identified issues but also meet the three major goals of increasing engagement, maintaining consistent brand design, and providing a better user experience.
