Bundles Comparison – Mobile

DriversEd.com

The DriversEd.com Bundles Landing Page offered comparisons between different educational packages. According to user data, the existing design isn’t reaching its maximum potential. Customers are ignoring the higher price bundles without understanding what they are offered. They are choosing the cheapest product they see first. The Call-to-Action button is also buried underneath lumps of content, making it difficult to be located. The goal of this project is to improve user flow and direct conversion on more profitable items. Broken down into 2 phases, we will first focus on mobile improvements.

Prototype of Design

Overall Design Updates

The new design is professional and easy to understand. A hero image replaces the stark blue background in the original layout. The headline is simplified to just the course title accompanied by important information such as official State licensing and approvals, age group, convenience of being wireless, and the return policy. For the rest of the page, there are less marketing content and more actual information so visitors can get to the point.

Displaying Bundles

To improve mobile experience, tabs are used to organize bundles. Users won’t have to scroll to discover there are 3 types of plans. Instead, they can simply click on each tab to learn more. This design model also allows marketing to select a plan to be featured. Since the “Smart” bundle is the most profitable, it should be seen first.

Instead of being the most expensive item, the “Expert” bundle is now “free” when you sign up for in-car driving lessons. If visitors are looking for the cheapest product, “free” will draw their attention to learn more.

Consistent CTA Location

In the original design, the Call-to-Action buttons is pushed all the way to the bottom when “Show Details” is toggled. Their placement should be more prominent and consistent. By moving the buttons higher (below pricing), visitors are being prepared to take action. When they are ready to purchase, they will know where to click.

“More Details” accordions are replaced by popovers to help visitors focus on important information. There will be no CTA buttons inside of popovers because their purpose is to educate and not to push sales. When visitors close the popover window, they will see the CTA button.

While “Sign Up” as the CTA message is direct, it is also boring to use on every single button. An action driven tone like “Get Smart Bundle” would encourage customers to respond.

Detail Mockup

Wireframes

“Smart” Bundle Mockup

“Smart” Bundle Wireframes

“Basic” and “Expert” Bundle Mockup

“Basic” and “Expert” Bundle Wireframes