Defining the UX Direction
User Goals
Quickly understand what Callee AI offers and the difference between its AI calling solutions and educational bootcamps.
Understand product benefits, features, pricing.
Easily compare available options for the educational plans.
Complete the enquiry or purchase journey with minimal friction.
Information Architecture Diagram
Mid Fidelity Design
This prototype lays out the core structure and user flow for the website. I only created two breakpoints for this version (desktop and mobile), as these are the most commonly used and would save time. The mid-fi prototype met the user goals by keeping the layout simple and easy to navigate. Users could quickly understand Callee AI’s services, compare the AI calling solutions and bootcamps, view key benefits and pricing, and move through the enquiry or purchase journey with minimal friction.
Assets
The assets were created using a combination of AI-generated imagery and Photoshop. I made sure every element matched with the company’s branding. It was important that all the text and images made sense. For example, the “AI Process Flow” shown on the whiteboard actually reflects how the AI works. Small details like these help make the visuals feel more professional and trustworthy.
For some brands, “professional and trustworthy” means using assets that don’t look AI-generated. However, given the nature of this brand, it’s unlikely that clients would be deterred by the use of AI-generated assets.
AI Generated Assets
Final Assets, Post Photoshop
High Fidelity Prototype
Interactable elements
Figma Prototype
The website is aimed at businesses, so the design is clean, corporate and tech focused. The overall goal is to make the company feel trustworthy and easy to work with, without making the design feel too formal or boring.
The final Figma prototype turns the mid-fidelity layouts into a responsive high-fidelity website across desktop, tablet and mobile.
