ExpressCNG Mobile App Re-Design
View UX Process & Old UI Design or Click UX Documatation & Old UI Design Button
View Re-Design Document or Click View Project Button
I undertook the complete UX and UI re-design of the ExpressCNG Mobile App, with the goal of transforming it into a market-ready product. During the project, I sought feedback from experienced product designers on my UX process and UI design. The feedback indicated that while the UX was effective, the UI needed a more modern approach. To confirm these insights, I conducted additional user testing, which echoed the need for a more visually engaging design.
Taking this feedback to heart, I carefully reassessed the project’s needs and identified specific areas for improvement. I then developed a visually appealing and modern design to address the UI concerns. Before moving to digital design, I created numerous pencil sketches to ensure a visually captivating user experience. I also added several new features and worked on over 25 interactive components to enhance the app's overall usability.
A detailed case study of this project is available on Behance: [Behance Link].
My Approach
Understanding the importance of a modern and user-friendly interface, I began by sketching out the user journey and visual elements. Taking into account the feedback from designers and users, I reworked the design to ensure it was both visually appealing and functional, with every element serving a clear purpose.
Vision and Innovation
The vision for the ExpressCNG re-design was to create an app that efficiently delivers its core services while providing a visually captivating experience. By integrating modern design principles and dynamic features, I ensured that the app would stand out in a competitive market with a unique and user-friendly interface.
Identifying Unique Challenges
Balancing the need for a clean, intuitive UI with the complexity of the app's functionality was a significant challenge. To address this, I created modular designs that could adapt to various user needs without sacrificing aesthetic appeal. The feedback process was critical in refining these elements to meet modern design standards.
Resolving Complex Problems
The re-design focused on simplifying complex processes for the user. I incorporated interactive components and responsive layouts to ensure smooth navigation, regardless of the device used.
User-Centric Design
The ExpressCNG re-design is deeply rooted in user-centric principles. Every aspect of the app was designed with the user in mind, from the initial sketches to the final interactive components. The goal was to create an app that not only meets but exceeds user expectations, making routine tasks enjoyable.
User Accessibility
Ensuring that the ExpressCNG Mobile App is accessible to all users, including those with disabilities, was a key focus during the redesign process. The app was built with accessibility in mind, incorporating features like:
Screen Reader Compatibility: All interactive elements are labeled appropriately to ensure that screen readers can easily navigate through the app, providing a seamless experience for visually impaired users.
Keyboard Navigation: Users can efficiently navigate through the app using a keyboard, ensuring that those who rely on assistive devices can access all features without limitations.
High-Contrast Mode: A high-contrast mode was included to assist users with visual impairments, ensuring that text and essential elements are clearly distinguishable.
Dynamic Text Resizing: The app supports dynamic text resizing, allowing users to adjust the text size based on their preferences without affecting the overall layout.
Touch Target Size: Interactive elements were designed with sufficient touch target sizes to accommodate users with motor impairments, reducing the chance of misclicks and ensuring a smooth user experience.
Meeting User Needs
The re-design of ExpressCNG was driven by the need to create a mobile app that is both functional and visually appealing. The adaptive design ensures optimal performance on all devices, while the modern UI elements help the app stand out in a crowded market.
Optimization and Performance
The ExpressCNG re-design also focused on optimizing the app's performance for smooth and responsive user experiences across all devices. Design elements like web fonts and sticky scrolling were fine-tuned to deliver the best possible user experience.
Conclusion
The re-design of the ExpressCNG Mobile App highlights my commitment to creating user-friendly, accessible, and visually appealing digital products. By incorporating feedback from both experienced designers and users, and focusing on both UX and UI, I transformed the app into a market-ready product that stands out for its functionality, design, and accessibility. This project showcases my ability to blend modern design principles with practical usability, creating a seamless and engaging user experience for all users.
