Redesigning Landing page for “Classic Global”
Note: I’m creating this case study out of a design assignment that I received from Izart Studio — a creative studio based out of Delhi striving to help founders build future resistant brands for the “UI Intern role”. So, I feel it is important to clarify that this project is not a collaboration with Izart Studio but rather a learning opportunity provided to me. My aim is to share my design process and the valuable lessons learned along the way.
OVERVIEW
Izart Studio is working with Classic Global, a company offering consulting services to companies who want to set up exhibition stalls in trade shows.
My assignment was clear: To create a compelling landing page that effectively communicates Classic Global's offerings and value proposition to potential clients.
Deadline: 48 hours
MY APPROACH
Given the time constraint, I structured my approach into three key phases: Inspiration & Mood-boarding, Low & High-Fidelity Designs, User Experience Optimisation.
Inspiration & Mood-boarding ✨
Before diving into the design, I focused on understanding Classic Global’s brand identity, target audience, and the overall industry landscape. Classic Global operates in a niche market, and their clients expect professionalism, clarity. My goal was to reflect these attributes in the design while ensuring a user-friendly experience.
To kickstart the creative process, I created a mood-board that aligned with Classic Global’s brand values. I researched websites of similar companies offering consulting and exhibition services. Key elements I looked for included:
- Bold and Clean Layouts: Websites that use large, impactful images, videos and clean typography to communicate professionalism.
- Color Schemes: I leaned towards a palette that combined neutral tones with bold accents to maintain a professional yet engaging look.
- Navigation Simplicity: Examples where the navigation is straightforward, with minimal distractions, which is crucial for users who want to quickly find relevant information.
Inspiration Sources: I took inspiration from websites like Rockwayexhibits, Expomarketing, Nth Degree and Nimlok, which all emphasize clarity, same brand message/goal and visual impact.
Now, comes the fun part i.e, designing the landing page. I was told to use Figma for executing my final designs. Before, moving on to the high-fidelity design I kind of mapped out a sketch on paper (wireframe) for the landing page just to get more clarity of content placement and visual hierarchy. As design is not just about aesthetics, but is also about functionality.
High-Fidelity Designs
Using Figma, I translated the wireframes into high-fidelity designs. Here’s a breakdown of key design elements:
- Hero Section: I chose a bold tagline and paired it with a striking image (infinite scroll) that reflects the grandeur of trade shows. The CTA button was placed prominently to encourage immediate action.
- Typography: I selected a modern, sans-serif font that ensured readability across devices while maintaining a professional look.
- Colour Palette: I used a combination of black and white for a clean base, with orange accents to draw attention to CTAs and key information.
- Images: High-quality images related to exhibitions were chosen to provide the website a more modern and clean look and also that visually communicate the brand’s expertise and services.
User Experience Optimisation ☑️
A breakdown of my thoughts. 💭 Let’s get into this:
- Hero Section:
I feel that the tagline “Exhibit Your Brand With Impact” is direct and impactful, clearly conveying the core message. The “Explore Now” CTA button is prominently positioned, using a strong colour contrast that effectively draws the user’s attention, prompting immediate engagement. The visuals complement the theme of exhibitions and trade shows, with the dark background creating a clean canvas that enhances the visibility of the tagline and CTA.
- Layout and Structure:
Who We Are, What we do, Why we do it Section: The layout here is clean and minimalist, allowing the content to stand out. I created a dropdown for these sections to enhance user engagement. Thus, adding a touch of interactivity.
Upcoming Tradeshows: The bold typography of “Upcoming Tradeshows” immediately grabs attention, while the accompanying image enriches the visual appeal of the section. The “View All” and “Register Now” CTAs are well-positioned and easy to locate, which is crucial for driving user interaction.
- Visual Consistency:
The consistent use of orange for the CTAs and headers provides a cohesive visual experience across the page. This choice not only maintains uniformity but also effectively guides the user’s focus from one section to another, ensuring a smooth flow through the content.
- Simplified Navigation:
Collapsed Menu: The simplified “Menu” button at the top right keeps the design clean and uncluttered. Expanding this into a detailed navigation panel enhances accessibility without overwhelming the user, striking a balance between simplicity and functionality.
Footer Navigation: The footer is thoughtfully organised, offering clear categories and a well-defined contact section.
- Text and Font:
The modern, readable fonts effectively capture attention, particularly the bold text in the hero section.
- Interactive Elements
Subtle animations were incorporated, such as hover effects on buttons, icons and sticky scroll on images, to make the user interaction more engaging without overwhelming them. These elements were designed to enhance the experience. Also, I tried scroll trigger animations in Figma for the first time through this project. Have a look here.
CONCLUSION & REFLECTION
Outcome: The redesigned landing page for Classic Global successfully combines modern design aesthetics with functional user experience. The bold hero section, clear navigation work together to create a professional and engaging platform that effectively communicates Classic Global’s offerings.
Lessons Learned: Working under a 48-hour deadline taught me the importance of quick decision-making and prioritising key design elements. I learned to balance creativity with functionality while staying true to the brand’s identity. This project also reinforced the value of mood-boarding and drawing inspiration from industry leaders to inform the design process.
Future Improvements: Given more time, I would integrate more interactive elements that could enhance user engagement. Also, make the website responsive.
