top of page
Loopr
Wireframing on Figma | UI/UX Design | Branding | E2E Design Collateral
About Loopr
Loopr is an AI visual inspection platform that offers comprehensive solutions for manufacturing industries. They leverage AI to enable high-precision defect detection and verification, using computer vision and machine learning. Led by an Indian female founder, and recognized as a Microsoft partner, Loopr delivers scalable, enterprise-grade quality control systems that integrate seamlessly into production lines, helping factories reduce errors, and future-proof their operations.
My Role in Loopr
As the sole designer in Loopr's founding phase for ~2 years, everything you see here is ideated and designed by me. I led the end-to-end design direction and implementation for Loopr - building a scalable branding system and redesigning the website. I also created marketing collateral and investor decks, by aligning with my content and strategy team. Thus, contributing to Loopr's vision of being a leading enterprise-grade AI visual inspection platform.
Redesigning Loopr's Website
Problem
The original Loopr website had several quality issues that hindered user understanding and trust:
-
Unclear messaging: Relied on buzzwords instead of clear targeted messaging
-
Weak visual communication: Minimal imagery, lack of product images reduced trust
-
Unclear user journey: Lacked prominent CTAs, resulting in low conversions
-
Outdated, sparse design: Minimalist aesthetic didn’t convey innovation or authority
-
Poor scalability: Difficult to adapt to new product lines or industry use cases
Solution
The Loopr website redesign addressed key issues with a more user-focused approach:
-
Simplified messaging: Clear, benefit-driven headlines that resonate with manufacturing professionals.
-
Enhanced visual storytelling: Used industry specific imagery to demonstrate the AI inspection process
-
Streamlined user journeys: Clear CTAs to guide visitors intuitively toward conversions.
-
Modern, trustworthy design: UI with clean but still minimal layouts, neat typography, and Loopr's colors
-
Scalable architecture: Flexible structure that adapts for different Loopr solutions and industry use cases.
Before
After
Phase 1: Research and Website Audit
Stakeholder Discussions:
Loopr’s founder and her team wanted a minimal, solution-focused website where design would support the product narrative rather than compete with it. They provided visual references to guide the preferred style - clean, simple, and highly functional.
The initial site architecture and targeted demographic discussions took place between the founder and our lead marketing strategist. Although I wasn’t part of the earliest structural conversations, I stepped in to evolve the visual system with input conveyed through the marketing lead.
Targeting manufacturing leaders and technical decision-makers, the goal decided upon was to create a website that emphasized clarity, professionalism, and intuitive navigation - helping establish trust quickly and making Loopr’s AI solutions feel powerful but also accessible.
Phase 2: UX Flows
Information Architecture:
The information architecture was kept lightweight, with as few pages as possible to concisely communicate the core solution offerings and industries served. This streamlined structure ensures users can quickly find relevant information without friction, supporting faster understanding and better conversion pathways.
Wireframes:
Based on the information architecture, and in collaboration with my marketing team lead for the content layout, the wireframes were created by me for each page.
(Scroll and zoom in on the Figma file, to see my work in detail).
Phase 3: Creating Hi-Fidelity Mockups
Visual Language Snippet:
.png)
Breaking Down the Design Choices:
The hero section immediately states what Loopr does with a bold headline and supporting subtext, removing ambiguity for first-time visitors and positioning Loopr's USP.
The primary CTA button is placed above the fold and repeated strategically across the page, making it effortless for users to take the next step, directly supporting lead generation goals.
Logos of Loopr's clients, immediately fosters trust and credibility.
Carefully chosen screenshots from LooprIQ's software demonstrates through a use case, the superior precision and accuracy of their visual inspection system compared to the human eye.
Real images of defect detection in the assembly line to ensure there's no abstraction or uncertainty in the capabilities of the software.
Dashboard and database feature is demonstrated directly through an image taken from Loopr's software as well.
Another CTA section, right after the capabilities of the software, to nudge the site visitor down the conversion funnel.
The very obvious benefits of choosing Loopr is listed out in clear points with icons.
If the user is still not convinced, an exploration of industry-specific solutions is provided in a visually distinct, new fold that contains different tabs for further exploration.
Resulting Impact:
The website mockups were handed off to the development team who proceeded to implement it. The site is currently live and has gone on to iterate and scale upon the original design that was established.
While I did not have direct access to internal web analytics or sales data to quantify the impact of the redesign, the Loopr team expressed satisfaction with the revamped website and overall user experience. Early feedback from the team indicated that the new website better aligned with Loopr’s positioning goals and created a stronger foundation for marketing and sales conversations.
Reflections:
Designing Loopr's website pushed me to explore simplicity, when working with highly technical products. I learned how to design with both marketing and sales goals in mind instead of always pushing for perfect, fancy visuals.
If I were to revisit the project, I would explore more interactive elements - by suggesting lightweight animations, scroll-animations or micro-interactions to bring life to the pages that are mostly static at this point. I would also try to push for closer collaboration with the analytics and sales teams post-launch to continuously refine the UX based on real user behavior data.
Shaping Loopr's Digital Front
At Loopr, I designed hundreds of assets to strengthen brand recognition and engagement - ranging from social media posts and technical carousels to paid lead generation ads. This is a small selection of my favorite designs. While the brand guidelines initially felt restrictively minimal, they ultimately challenged me to craft visually arresting, supporting imagery within a focused system.
Creating Winning Investor Decks
I designed multiple decks for Loopr across different initiatives, but this one was particularly meaningful. The challenge was to create a hyper-minimal yet elevated and refined presentation for Sandvik’s Startup Challenge - where the stakes included a $30,000 MVP collaboration opportunity with Sandvik’s global customer base. The design needed to communicate Loopr’s technical excellence with clarity, sophistication, and restraint. I'm proud that the final deck that I labored on with a 1 day TAT, supported Loopr’s strong pitch, helping them win the grant and securing a valuable new client partnership.
bottom of page