Dobell Сase Study
Dobell is a stylish menswear store operating in the United Kingdom and serving men worldwide. The store provides a huge selection of menswear, starting from different shirts and various accessories to formal business suits made of various materials with a wide selection of colors for every taste.
Clients goal
Sam eCommerce team gets a complex task. The entire website was based on the outdated version of Magento 1, and the main goal was to transfer all the functionality to Magento 2. We also needed to update the website design, refresh the pages’ layout, add a full-fledged blog to the website and introduce additional payment systems.
Our approach
Since we specialize in Magento migration, we made a complete transfer of the website’s functionality and onboard customer’s staff to new features and improvements. Before starting our work, we received an approximate website design from the customer, and adjusted the customer’s wishes to modern UI/UX methodologies.
CORE PLATFORM Magento 2
Result
REWORKED HOMEPAGE
We have placed all possible website categories in the header and made a convenient pop-up menu for each category. All these elements immediately make it clear that the website is selling business menswear.
go to siteAbout Homepage
In the Dobell website design, we decided to stick to simplicity and colorfulness, dividing the entire page into blocks and supporting this with photographs of clothing models.
PROFILE PAGE
After a lengthy discussion, we decided not to overload this page’s design and make the division into small blocks. There are 5 of them in total: dashboard, address book, my orders, wishlist, and newsletter.
go to siteAbout Profile page
Profile page allows the user to fill in contact information about himself, speed up the service, and open additional features on the site, such as tracking the parcel, etc. The user can easily track all their parcels and fill in the detailed information for a more personalized experience.
REDESIGNED PRODUCT PAGE
The whole page is divided into two parts. The upper part contains a carousel of images and photos of products that go with a set of clothes with a choice of size, and an add-to-cart button.
go to siteAbout product page
Without a product page, eCommerce websites are meaningless. This page contains all the necessary information about the product, its photographs, and buttons to purchase the product.
BLOG PAGE
In the design of this page, we also followed the page splitting technique. The left block is devoted to recent publications, while the right block displays the titles of the articles with their brief descriptions and images.
go to siteAbout Blog page
Blog page allows website owners to engage in content marketing and publish various blog posts to promote certain products, provide useful information related to the website’s topic, and attract potential customers.
Features
01 Website Navigation
We aimed to show in the footer all types of clothing that the website has to offer. When hovering over any category, a drop-down menu appears where the buyer can take an in-depth look at the category’s contents. We also placed the Profile page, Shopping Cart, Wishlist, and the currency change button.
02 Search Bar
Such a simple thing as a search bar also required some work, and we placed it in the upper left corner specifically for buyers who already know what they are looking for. We also implemented drop-down suggestions based on user’s queries.
03 Filter Options
We moved away from the standard layout of filters on the website’s left side and decided to access them upon entering the category immediately. The user can enter the desired parameters before starting the search and scroll down to see the result.
04 Checkout Flow
In the redesign of the checkout process, we also decided to make it as simple as possible. Instead of distributing each step to separate pages, we have put the entire process on one, dividing each step into a separate custom column.
05 Payment Options
At the request of the client, our task was to implement additional payment methods for the goods. The website already had payment via Visa, Mastercard, and American Express. We have added payments via Amazon and Paypal for the better convenience of the store customers.
Results we achieved
After the work on the website was finished, the client and his staff immediately noted the excellent design that combines rigor and overall simplicity. Besides, website conversion has increased significantly due to the implementation of new payment methods. And the final cherry on top, the website performance was greatly enhanced thanks to the full migration to the modern Magento 2 platform.
Development stages
Business discovery, Migration to Magento 2, website pages redesign, web engineering, testing, onboarding process, release
Tech stack
PHP, MySQL, JavaScript, CSS, AJAX
Platform
Magento 2
Development team
1 project manager, 1 UI/UX designer, 2 developers, 1 DevOps, 1 QA
Time
5 months
