KL, MY • 4.2105° N • 101.9758° E
Website Design for an innovation centre
Revamping an innovation lab's website, blending the latest UI trends and interactions to create an engaging and user-friendly digital space that aligns seamlessly with the client's visionary goals.
Services
Moodboarding, Visual design, UI/UX
Client
Top Oil major in Middle East
Tools
Adobe XD, Miro
Year
2023
About the project
About the project
About the project
Our client, a newly established innovation lab center, sought to transform their website's visual identity to enhance user-friendliness and establish themselves as a prominent player in product development within their region. The ultimate goal was to communicate their vision effectively and showcase their services through a seamless and user-centric website.
Our client, a newly established innovation lab center, sought to transform their website's visual identity to enhance user-friendliness and establish themselves as a prominent player in product development within their region. The ultimate goal was to communicate their vision effectively and showcase their services through a seamless and user-centric website.
Our client, a newly established innovation lab center, sought to transform their website's visual identity to enhance user-friendliness and establish themselves as a prominent player in product development within their region. The ultimate goal was to communicate their vision effectively and showcase their services through a seamless and user-centric website.
The problem
The problem
The problem
The existing dashboard UI presented challenges such as convoluted workflows and usability issues, resulting in difficulties for users to complete their regular tasks efficiently. The UI also lacked error prevention measures and was challenging to comprehend. At Designit, our team identified opportunities to enhance the UX for a more comprehensive, user-centric, and streamlined experience.
The existing dashboard UI presented challenges such as convoluted workflows and usability issues, resulting in difficulties for users to complete their regular tasks efficiently. The UI also lacked error prevention measures and was challenging to comprehend. At Designit, our team identified opportunities to enhance the UX for a more comprehensive, user-centric, and streamlined experience.
The existing dashboard UI presented challenges such as convoluted workflows and usability issues, resulting in difficulties for users to complete their regular tasks efficiently. The UI also lacked error prevention measures and was challenging to comprehend. At Designit, our team identified opportunities to enhance the UX for a more comprehensive, user-centric, and streamlined experience.
My role
My role
My role
Explored various concepts and established a visual design style for the website. Creating responsive screens in two languages, with a focus on mobile and web accessibility, we infused dynamic elements such as micro interactions and animations to deliver an engaging and innovative user experience. Close collaboration with the client, development, and quality assurance teams ensured a smooth design handoff and governance process.
Explored various concepts and established a visual design style for the website. Creating responsive screens in two languages, with a focus on mobile and web accessibility, we infused dynamic elements such as micro interactions and animations to deliver an engaging and innovative user experience. Close collaboration with the client, development, and quality assurance teams ensured a smooth design handoff and governance process.
Explored various concepts and established a visual design style for the website. Creating responsive screens in two languages, with a focus on mobile and web accessibility, we infused dynamic elements such as micro interactions and animations to deliver an engaging and innovative user experience. Close collaboration with the client, development, and quality assurance teams ensured a smooth design handoff and governance process.
Exploring different concepts
Exploring different concepts
The client desired an innovative website capturing their vision. To achieve this, we engaged in moodboarding to define the direction, producing multiple iterations for key screens that embraced the latest UI trends and interactions. We didn't limit our creativity while coming up with new concepts and explored diverse themes, interactions, and combinations for a dynamic and engaging result.
The client desired an innovative website capturing their vision. To achieve this, we engaged in moodboarding to define the direction, producing multiple iterations for key screens that embraced the latest UI trends and interactions. We didn't limit our creativity while coming up with new concepts and explored diverse themes, interactions, and combinations for a dynamic and engaging result.
Our solution
Our solution
Our solution
The core objective was to craft an engaging and innovative user experience. Emphasizing innovation, we integrated lively elements, micro interactions, and visual effects, setting the website apart in style and personality. The design followed a mobile-first approach, ensuring accessibility across multiple devices.
The core objective was to craft an engaging and innovative user experience. Emphasizing innovation, we integrated lively elements, micro interactions, and visual effects, setting the website apart in style and personality. The design followed a mobile-first approach, ensuring accessibility across multiple devices.
The core objective was to craft an engaging and innovative user experience. Emphasizing innovation, we integrated lively elements, micro interactions, and visual effects, setting the website apart in style and personality. The design followed a mobile-first approach, ensuring accessibility across multiple devices.
Design for Arabic & English
Design for Arabic & English
Designing for both Arabic and English presented a unique challenge in accommodating bidirectional text flow for Arabic and the standard left-to-right layout for English. Striking a balance between the two languages required meticulous attention to typography, ensuring legibility and aesthetic appeal. The bilingual interface aimed for seamless coexistence, emphasizing cultural sensitivity in its design to cater to a diverse linguistic audience.
Designing for both Arabic and English presented a unique challenge in accommodating bidirectional text flow for Arabic and the standard left-to-right layout for English. Striking a balance between the two languages required meticulous attention to typography, ensuring legibility and aesthetic appeal. The bilingual interface aimed for seamless coexistence, emphasizing cultural sensitivity in its design to cater to a diverse linguistic audience.
Design handoff & UI governance
Design handoff & UI governance
Design handoff & UI governance
In this swift project, our team designed and developed the website across all platforms using a phased delivery approach. Designs created in Adobe XD were shared with the development and QA teams through prototype links and assets. Regular demo calls and effective communication ensured seamless collaboration, aligning the developed website with the envisioned design.
In this swift project, our team designed and developed the website across all platforms using a phased delivery approach. Designs created in Adobe XD were shared with the development and QA teams through prototype links and assets. Regular demo calls and effective communication ensured seamless collaboration, aligning the developed website with the envisioned design.
In this swift project, our team designed and developed the website across all platforms using a phased delivery approach. Designs created in Adobe XD were shared with the development and QA teams through prototype links and assets. Regular demo calls and effective communication ensured seamless collaboration, aligning the developed website with the envisioned design.
Key screens
Key screens
Learnings & takeaways
Learnings & takeaways
Learnings & takeaways
Collaborating with a cross-functional team
Collaborating with a cross-functional team
Engaging with developers, quality assurance, and content management teams highlighted the importance of regular communication and transparency across diverse functions.
Engaging with developers, quality assurance, and content management teams highlighted the importance of regular communication and transparency across diverse functions.
Meeting deadlines
Meeting deadlines
Despite challenges such as delayed feedback and multiple iterations, effective goal-setting and planning allowed us to manage time efficiently and meet deadlines.
Despite challenges such as delayed feedback and multiple iterations, effective goal-setting and planning allowed us to manage time efficiently and meet deadlines.
Design handoff
Design handoff
Establishing a seamless design handoff process was pivotal for team collaboration. Continuous refinement, demo sessions, and clear communication channels ensured a successful transition from design to implementation.
Establishing a seamless design handoff process was pivotal for team collaboration. Continuous refinement, demo sessions, and clear communication channels ensured a successful transition from design to implementation.
Other projects
Harshini Narendra • Experience Designer
Toodles! ✨
Harshini Narendra
Toodles! ✨