Bleems S.P.C.
Items Details Page Design (Bleems)
Project Brief:
During my tenure at Bleems, I identified a critical opportunity to improve the performance of our item details page. The existing design, while functional, left room for improvement in terms of driving conversions. By focusing on optimizing the information architecture and refining the layout, I sought out with the team to create a page that struck the perfect balance between relevance, usability, and visual appeal.
Scope of Work:
The scope of work for building this feature is centered around five key sections, covering everything from planning the layout of the item details page to its successful delivery and measurable outcomes.
Information Architecture
The content should be organized to make critical purchasing details—such as the product name, price, delivery options, and Add to Cart button—immediately visible and scannable. Related information, like dimensions, product descriptions, and reviews, should be grouped into clearly defined sections to avoid clutter and enhance readability.
Core Elements and Layout Priorities
The hero image carousel should feature high-quality product images with intuitive navigation and pinch-to-zoom or fullscreen capabilities. The product name, price, and trust-building indicators like "Trending Item" or "Same Day Delivery" must be prominently displayed. Key tools like the Size Guide and AR View should be easily accessible, with labels or instructions to guide interaction. The Similar Products section should display visually complementary items in a horizontal scroll, and the Add to Cart button should be bold and paired with a simple quantity selector.
User Experience Enhancements
Fast delivery options like "Same Day Delivery" should be highlighted with clear icons, and users should be able to check delivery availability by location. The star rating and number of reviews should be clickable to bring users directly to the reviews section. Icons for sharing, favoriting, and product enlargement should be consistent and easy to access, ensuring interactive tools like AR do not overwhelm the user or distract from the primary purchase flow.
Success Metrics
Success will be measured through at least a 2.5% improvement in conversion rates and a least a 5% reduction in bounce rates. These metrics will validate the effectiveness of the redesign and highlight user engagement improvements.
Deliverables
Deliverables include low and high-fidelity prototypes that showcase the redesigned layout, along with detailed UI designs integrating tools like the Size Guide and AR feature. Comprehensive documentation will accompany these designs, outlining technical details and user flow to ensure smooth development. Final usability testing and A/B tests will validate the page's impact on usability and conversion.
Project Details:
Figma Prototype:
The redesigned Item Details Page successfully addressed the objectives outlined in the scope of work, delivering measurable improvements in user engagement and conversion rates. We were able to increase conversions by approximately 3.4% and reduce our bounced rate by almost 6%!
By focusing on clear information architecture and intuitive layouts, the page ensured that essential details—such as product name, price, and Add to Cart functionality—were prominently displayed and easy to navigate. Grouping related information like dimensions, product descriptions, and reviews into distinct sections reduced visual clutter and enhanced readability.
This project demonstrates a strategic approach to improving e-commerce experiences by putting our user's needs first in order to achieve our desired business goals.
Please see the below images to see the final design.
Project Images:
