B2B E-commerce & Branding for Robotics & Drone Solutions
Project Overview
Leading brand identity, UI/UX design, and front-end implementation for a new Shopify Plus store as Norsat expands into robotics and drones
Timeline
2026 — 2 months
Role
Branding, UI/UX Lead & Front-end Developer, PDM
Company
Norsat International, inc.
Team
Cross-functional — Collaborating with product owners, and business stakeholders on MVP priorities and platform strategy
Tech Stack/ Tool
Figma, Illustrator, Shopify Liquid, JavaScript, Shopify Plus, Shopify Metafields, Windchill, Business Central
Impact
Reached 546 unique users and shipped products for a B2B company within the first month of launch.
Live URL
Live URLThe Situation
Background
Norsat International was expanding beyond satellite communication products into robotics and drone solutions, requiring a new brand identity and digital experience tailored for government-level B2B customers in the agriculture industry.
The Challenge
The challenge was to differentiate the new robotics division from Norsat's existing satellite business while establishing trust in a highly technical B2B market serving government and enterprise customers.
The Solution
I led branding, brand strategy, UX/UI design, and Shopify front-end development using Liquid and JavaScript. I created a B2B-focused visual identity, defined go-to-market positioning, restructured Shopify data architecture for complex product navigation, and supported integrations with Windchill and Business Central to create a scalable platform for managing and exploring robotics products.
My Role
Leading the brand identity, user experience, and Shopify Plus front-end development. Responsible for creating the B2B design system, structuring Shopify metafields to sync with Windchill and Business Central, and collaborating with cross-functional stakeholders on MVP priorities.
Key Features & Screenshots
Branding
The brand needed to communicate innovation and future-focused autonomous solutions while reinforcing credibility through official partnerships with major technology providers such as DJI and specialized training from experienced engineers. For the colour palette, we used unsaturated green as the primary color. Instead of black—the default for many robotics and drone companies—we differentiated the brand from competitors. This palette maintains reliability for B2B customers, especially in government roles, while conveying a clean, innovative feel. We also validated colour choices for accessibility to support users with low vision. While building and syncing components in the design system, I created UI components quickly and expanded the system for the software development team and graphic designers to apply across product and marketing materials. For the logo, we chose Michroma and Montserrat as our typeface pairing. Michroma introduces a futuristic feel without being overly flashy or technical, which fit our brand identity well. The symbol incorporates an "A" shape from the brand name and motifs inspired by robot and drone airframes.
Strategy
I began with competitive analysis during the early brand strategy phase. To generate ideas, I interviewed the product owner, CEO, and product development team, and researched competitors and the existing Norsat website. Through this work, I defined three strategic strengths: 1. Air and ground capability — Competitors often offer only UAVs (drones) or ground robots, which limits clients tackling complex enterprise problems. We provide both air and ground products. 2. Trusted global brand and stability — Norsat has 40 years of history with engineers who customize products for clients. We are an official DJI distributor, offering competitive pricing plus specialized service and training for DJI products. 3. A solution company, not just a product seller — We help customers solve problems using robotics technology. For example, we organize the client's challenge, define goals, select products and accessories to match, deploy drones, analyze data, and transform raw data into structured insights.
UX Navigation Through Custom Feature Development
I created a custom product hierarchy for categories and product models across the website. This structure was implemented on collection pages, product pages through a compatible products section that recommends accessories for specific products, and accessory product filters. This improved product discoverability and reduced friction when users searched for specific brands or compatible items. For example, I developed a hierarchy such as Drone → DJI Products → DJI Product Lines, a structure that Shopify Plus did not support out of the box. I designed the information architecture, translated it into Shopify metafields, implemented the experience on the frontend, and collaborated with the product management team to establish data population and synchronization workflows. This improved the browsing experience and supported e-commerce growth.
Custom Shopify UI Components and Design System Development
I developed custom Shopify UI components, including color themes and product card components, to improve content creation efficiency and maintain brand consistency. I created two variations of color schemes and card components, enabling designers and developers to build new content through Shopify’s editor without requiring extensive design knowledge. These components reduced repetitive development work and followed Shopify’s latest theme folder structure and architecture. Additionally, I created a design system using AI-assisted design workflows with Claude, enabling both software and hardware teams at AeroBot Intelligence to adopt consistent frontend patterns and branding across products and digital experiences.
Information Architecture
We decided to focus on product and service content because it directly connects to revenue. Initially, the PO and CEO wanted a single services page covering training and rental. However, competitive research showed that separating services, rental, and training was easier to navigate. We also created resource pages (case studies, news), solution pages, and industry pages as lower-priority items for the first release. On the homepage, I included links to all major sections while keeping the layout clear and uncluttered.
Outcomes
Reached 546 unique users and shipped products for a B2B company within the first month of launch.