Services
Visual Design
UI & UX Design
Role
Sole Designer
Tools
Figma
Material UI
Landing Page Redesign
00.01
Overview
This case study showcases the comprehensive redesign of the SoF platform, encompassing the web app, landing page, logo, and social media posts. The project aimed to address usability issues, enable scalability, strengthen brand identity, and achieve widespread adoption. As the sole designer, I collaborated closely with the development team to ensure design coherence and platform functionality. Despite time constraints, the redesigns were successfully implemented in over 180 organizations, gaining approval from the National Argentine Firefighters Council for nationwide implementation.
00.02
Problem Statement
The previous UI design of the SoF web app received negative user feedback, resulting in a poor user experience. Additionally, the platform faced limitations in scalability, preventing the implementation of new functionalities. Furthermore, the brand presence and visual communication across the landing page, logo, and social media posts needed improvement. The problem was to redesign the entire user experience, establish a scalable foundation, enhance branding elements, and adopt the principles of Material Design 3 to create a cohesive and engaging SoF platform.
Web App Redesign
00.03
Goals
(A) Improve User Experience
Enhance the usability and user-friendliness of the SoF web app, enabling users to easily navigate, access information, and interact with the platform's features.
(B) Enable Scalability
Redesign the architecture and codebase of the web app to create a scalable foundation, facilitating the seamless integration of new functionalities and future enhancements.
(C) Enhance Branding
Enhance the usability and user-friendliness of the SoF web app, enabling users to easily navigate, access information, and interact with the platform's features.
(D) Streamline Workflow
Simplify task flows within the web app to optimize user productivity, making it easier for users to access early alert information and perform actions efficiently.
(E) Improve Engagement
Develop visually appealing and engaging design elements across the web app, landing page, logo, and social media posts to increase user interaction and involvement with the SoF platform.
Before & After - Main Platform UI
00.04
Process and Methodology
(A) Competitive Analysis
Analyzed other scalable monitoring platforms and reviewed successful branding strategies to gather insights, identify best practices, and benchmark against industry standards.
(B) Information Architecture
Redesigned the structure, navigation, and information hierarchy of the web app to enhance usability, streamline workflows, and accommodate future scalability.
(C) Wireframing and Prototyping
Developed low-fidelity wireframes and interactive prototypes to visualize the new UI design, validate design decisions, and gather feedback from stakeholders.
(D) Visual Design
Created a visually appealing design language consistent across the web app, landing page, logo, and social media posts, incorporating appropriate colors, typography, and imagery to enhance the overall user experience and strengthen brand identity.
(E) Iterative Testing and Refinement
Conducted usability tests on high-fidelity prototypes, gathered feedback, and iteratively refined the design based on findings.
(F) Development and Implementation
Collaborated closely with the development team to ensure the seamless integration of the redesigned web app, landing page, logo, and social media posts.
Figma Components
Video Presenting Main UI Interactions
00.05
Results and Impact
(A) Improved User Experience
Users found the new UI design of the web app more intuitive, efficient, and visually appealing, resulting in enhanced engagement and satisfaction.
(B) Scalability and Future-Proofing
The redesigned architecture and codebase provided a scalable foundation, enabling the seamless integration of new functionalities and future enhancements.
(C) Enhanced Branding
The revamped landing page, logo, and social media posts established a strong brand identity, effectively communicating the mission and values of SoF and fostering a sense of trust among users.
(D) Widespread Adoption
The redesigned platform helped achieve approval from the National Argentine Firefighters Council for nationwide implementation and was successfully implemented in over 180 organizations.
Social Media Posts & Logo Design
00.06
Conclusion
The redesign of the SoF web app, landing page, logo, and social media posts successfully addressed usability issues, scalability limitations, and branding challenges. The user experience was significantly improved, and the platform now has a solid foundation for future enhancements and nationwide implementation. The cohesive branding elements created a strong brand identity, and the efficient collaboration between design and development teams ensured design coherence and platform functionality. Despite time constraints, the redesigns gained widespread adoption, enabling SoF to make a positive impact in over 180 organizations.
Franco Rodriguez Viaw · CEO & Co-founder, Satellites on Fire - Pitching in Explorer Latam Venture Capital
Other projects
