Esvata Product Line Web Pages Design
Duration: 2 weeks; 03/2024
Tools: Figma
Designed desktop and mobile interfaces for showcasing products, adhering to design system of the existing website
Design for Wise Arrangement of Dense Information
The density of information Esvata wanted to have, considering SEO, was high. Housing all the required content while maintaining aesthetically appealing and user-friendly interfaces was the major aspect I invested my effort into.
Interactive elements to maintain clean interface while housing all the details.
Section that provides an overview of the content of the page and allows fast and easy exploration enabled by scrolling-to-section interaction and a back-to-top button.
Accordions to house dense information while maintaining clean interfaces.
Responsive Design for Optimal User Experience on Mobile
—>
Version 2(Final)
Version 1
In order to achieve optimal mobile experience, adjustments were made in consideration of mobile environment.
There were a few iterations to achieve the optimal design. The initial design of the product line list was made as a direct conversion of the desktop design with details of a product category open within the frame after clicking. Though this design would be easiest for development, after discussion with client, the density of information would appear too high in the frame on mobile. Therefore, I changed the design to house the details in pop-up windows to make the content more readable and links easier to click.
