Boosting Engagement by 11 Seconds: UX & UI for Jagma
Jagma is a comprehensive service provider specializing in planning and designing for home and commercial extensions and refurbishments. They assist clients in creating and securing planning permissions and connect them with reliable construction professionals to bring their projects to life.
The Brief
The task was to optimise Jagma’s Wix website to generate more leads. The Jagma team wasn’t entirely sure what needed improvement, but they were looking to ensure their site was best suited for lead generation. I started off with the site evaluation.
Logistics
Team
Me – Designer/ Creative
Software used
- Figma
- Figma Jam
- Wix
My Role
- Analysed and applied insights from Google Analytics to optimize user engagement
- User journey & flows
- Evaluated site usability and identified pain points
- Wire-frames
- User Interface
- Design System
- Overall responsibility for the visual design and branding
- Project Managment & Strategy
Time Frame
Research, analysis, wire-frames: 2.5 days
Design system & core layouts: 1 day
Wix Site Development and theme customasation: 4 days
Initial Evaluation
While Jagma’s website was clear and well-structured, there were several issues, both urgent and non-urgent.
Urgent:
- Some sections weren’t responsive on smaller screens.
- Colour contrast issues that impacted accessibility.
Non-Urgent:
- The design system didn’t fully reflect Jagma’s brand or values.
- Information needed to be reorganized—while the content was strong, it wasn’t presented in an engaging way. Long text blocks lacked images and clear structure.
- The user interface needed improvement to enhance the overall user experience.
- The website could better highlight Jagma’s value proposition, with more strategically placed CTAs and more engaging content.
Proposed Steps
To address these challenges, I broke the project into four phases, ensuring the client was more involved throughout the process than usual.
Step 1: Address Urgent Issues
I tackled the most urgent issues immediately, as they were quick fixes that would have an immediate, positive impact on user experience.
Step 2: Align the Website with the Brand
Given that the site was built on Wix, I focused on customising a new template to reflect Jagma’s brand values.
Step 3: Analytics & User Needs Evaluation
Using insights from Google Analytics I mapped out the user journey and user flows, which informed the website’s layout and structure. The outputs included Key insights, wireframes, and user flows.
Step 4: Design Core Layouts
I customised four core layouts with variations using the chosen template, ensuring a consistent and visually engaging experience across the website.
Step 2: Creating Stronger Ties to the Brand
I wanted users to feel connected to Jagma’s core values: quality, great value, and excellent service. I focused on creating a theme that was approachable, modern, and with a classic twist.
Goals/aims that had impact on visual decisions
Attracting High-End Clients
While Jagma had a broad audience, they wanted to attract more premium clients. To achieve this, I wanted to convey sophistication and exclusivity. Some concepts incorporated sharper, more contrasted features into the design while maintaining layouts with plenty of negative space. Concepts 2 and 3 particularly embody this approach, with the downside being the risk of alienating broader audiences due to their less approachable tone.
Creating Trust
Pairing the clean, modern Inter font with the brand’s primary blue colour established a sense of professionalism and reliability. This combination reinforced Jagma’s image as a modern, efficient, and trustworthy brand.
Concept Variations:
- Concept 1: A soft theme with practical layouts showcasing Jagma’s process, with a friendly yet classic design.
- Concept 2: A bold, modern geometric layout that aligned with Jagma’s architectural focus, using a prominent brand colour and full-bleed images.
- Concept 3: Similar to Concept 2 but with a more relaxed, with a more creative edge, balanced by sharp design elements.
Step 3.1: Key Insights from Google Analytics
Visitor Trends
- The number of visitors to the site remains consistent throughout the year, with expected seasonal peaks and dips.
- Interest in home extensions, as shown by Google Trends, aligns closely with traffic patterns on Jagma’s website.
Landing Pages
- The most visited landing pages are: Home, Portfolio, and Services.
- While overall user engagement across the site is good, the Home page has lower engagement compared to other pages. This could indicate a loss of potential leads due to insufficient engagement on the landing page, resulting in fewer conversions.
- Once users engage beyond the Home page, they show a strong interest in Jagma’s services, indicating high potential for conversion if initial engagement is addressed.
User Journey
- The most common user pathway is: Home → Contact → Further Business Research, suggesting strong intent to connect with Jagma.
- Other pathways include: Home → More Research (visiting pages such as Services, Portfolio, or About).
These insights informed key design decisions, ensuring the site improvements focused on boosting engagement on the Home page while optimising pathways to conversion.
Step 3.2 : User Journey and Flows
User Journey
I identified opportunities to improve the site. Users’ primary concerns were cost and the hassle of the process. To address this I made notes to:
Include helpful, free content. This would position Jagma as an industry leader as well as clear up any possible doubts, therefore addressing the hassle issue.
Including images and examples of successful projects would engage users, making them envision their extension and feel more confident in their decisions.
Once users were convinced, positioning Jagma as the best choice was critical. I did this by adding value propositions and trust factors strategically through the site.
User Flows
Analytics revealed the path of least resistance, which I translated into intuitive layouts in the wireframes.
Step 3.3: Wireframes
I focused heavily on the stages block during the wireframing process, as it presented an excellent opportunity to establish Jagma as an industry leader. This block allowed us to highlight why Jagma excels at what they do while simultaneously educating users about the process. It addressed key points in the user journey, which is why I proposed creating two versions: one more detailed and one less so.
- Variation 1A focused on a clear and straightforward step-by-step progression, visually emphasising the journey.
- Variation 1B included more details and photos for added depth.
- Option 2 provided even greater detail for users seeking comprehensive information.
Ultimately, we decided to use Option 1A on the home page and other prominent areas, as it offered a concise overview that visually emphasised progression and made it easy for users to click for more details if they wanted. For more in-depth sections, we opted for Option 2A, which presented the full process for users who wanted a deeper dive.
This approach balanced clarity and depth, ensuring the website was intuitive while catering to different user preferences. By focusing on progression and steps, we aimed to communicate how Jagma supports clients throughout their journey, reinforcing the idea that their service is reliable and hassle-free.
Step 4: Layouts & Build
The final design was based on Concept 1, customized to align with Jagma’s brand. Here are the key design system improvements I made:
- Font: I chose Inter, a clean, modern font with a friendly touch, perfect for a professional yet approachable look.
- Colours: I used the main brand colour as an accent, paired with calming shades of grey and pastel blues to create a friendly, reliable experience.
- Buttons: Buttons were designed with filled colours and slightly rounded corners to add friendliness to the otherwise clinical design.
- Logo: I integrated the logo as a design pattern in call-to-action areas, reinforcing the brand throughout the website.
Results
After implementing the core layout changes and gaining client approval, I applied the updates to the Wix site. Six months after the website had gone live, I checked in with the client and I’m happy to report the following improvements:
- Average engagement time increased by 11 seconds across the site.
- Engagement on the homepage increased by 5 seconds on average.
- Lead generation increased from 7 to 10 leads per month.
” Laxmi and Dom have provided a truly excellent service. Our previous website design was dated and did not flow very well but after Laxmi suggestions and redesign, our website is now modern looking and easier to read. The number of enquiries we receive has increased following the redesign. “
Client from JAGMA Property Services