Web design for Micro Engineering Tech Inc.

About Micro Engineering

Micro Engineering (METI) approached me to update their website and web presence. Their existing site had far too much text, and navigation was difficult. The firm also looking for a visual update that could set them apart from their competitors and represent their services (Digital Transformation) cleanly and effectively.

Application: Website

Project Duration: Dec 2020 - April 2021

Team: Business Analyst, Web Designer (me), Full Stack Developer

Final Deliverables: Competitive Research, High Fidelity Design, Wireframe, Site Audit, Voice & Tone Document

Objectives for Micro Engineering's Web Redesign

Objectives for Micro Engineering's Web Redesign

Objectives for Micro Engineering's
Web Redesign

  1. Improve User Engagement - Increase time spent on the site and reduce bounce rates.

  1. Improve User Engagement - Increase time spent on the site and reduce bounce rates.

  1. Refine voice & tone - improve content to engage both technical and non-technical audiences

  1. Refine voice & tone - improve content to engage both technical and non-technical audiences

  1. Boost Conversion Metrics: Drive more inquiries through a better user journey.

  1. Boost Conversion Metrics: Drive more inquiries through a better user journey.

Project Outcomes

-40%

Navigation Time

Increased

Conversion Rate

Initial Assessment

Evaluating the Current Site

I conducted a comprehensive site audit, analyzing the overall user experience and visual design of the website. My primary focus was on the content—how it was presented and how it could be optimized for maximum impact. I identified key areas for improvement in visual design and layout, enhancing readability and creating a stronger visual presence. Additionally, I established success metrics to track progress, ensuring the website effectively attracts users and engages its core audience over time.

My team conducted interviews with 10 users, including both administrative staff and volunteer registrants.

The Athlete user process goes through multiple different information sections before the application can be submitted.

Design Approach

Visual Design

I collaborated with the Micro Engineering team to plan the updated layout and designs, focusing on how to refresh existing content while preserving the core messaging and highlight their offerings. I presented several layout and design samples, each tailored to enhance visual clarity and deliver a more engaging and dynamic user experience, ensuring the final design aligned with both user needs and METI's brand goals.

Each Special Olympics Canada provincial Chapter used different registration portals and forms.

To build a universal online portal, we needed to establish a minimum standard that everyone could agree on.

We started by creating a Minimum Viable Record (MVR) by documenting, listing, and comparing the unique needs of each chapter.

Refining Voice & Tone

The site’s content was overly technical and lengthy, a common user complaint. With many visitors from finance or government sectors, we needed to simplify messaging for broader accessibility by distilling complex ideas into concise language. I aimed to create a consistent tone that aligned with Micro Engineering’s brand identity.

Our MVR revealed several outdated registration fields and elements that made the layout feel cluttered and disrupted the user flow.

By removing these unnecessary fields and updating the layout for better readability, we can create a more streamlined form that improves both usability and the overall user experience.

Project Outcomes

Project Outcomes

Improved Layout & Design

I enhanced content-heavy sections with visuals for clarity and interest, condensed written content, and linked to technical pages only when necessary. Typography was updated with adjusted font weights for better readability and hierarchy. Generic stock photos were replaced with high-resolution images and custom illustrations. The color palette was refreshed with bright, bold tones, including METI's signature deep blue, to create a vibrant, on-brand design.

The MVR process allowed us the opportunity to check in with each Chapter and understand their unique needs.

This collaborative effort also helped Chapters gain more participation and empowered them in the design process, fostering cooperation and understanding in the future.

Simplifying Navigation

The original menu structure was cluttered, with too many options and redundant pages. Most services could be consolidated into four main categories. With this in mind, I prioritized emphasizing "Services" and "Contact"— highlighting Micro Engineering's unique selling points and guiding users toward reaching out.

After finalizing the MVR, we successfully reduced the number of fields by 40%, allowing for greater flexibility in restructuring the registration form.

We organized the remaining fields into distinct sections, enhancing both readability and scannability for users.

Enhancing Enrollment Layout

Services are now organized into 4 main categories - allowing visitors to quickly get to the sections they want, reducing frustration and improving overall usability. A prominently displayed call-to-action (CTA) now stands out on every page, encouraging users to take action—whether booking a service, submitting an inquiry, or learning more — making it easier for customers to connect with the business and achieve their goals.

Enhancing Enrollment Layout

To address the challenges faced by admin staff, we added sticky navigation to the layout. This allows them to easily switch between sections of the form, which reduces the cognitive load of having to focus on a long, single-page document.

This improvement streamlines their workflow, making the process of approving enrollments more efficient.

Takeaways

Takeaways

Implementing Analytics

Implementing Analytics

I would have liked to incorporate at-a-glance heatmaps of user interactions and activities. We could use this information to keep updated the pages and see what we can improve.

Draft content guidelines

Creating a set of content documents could help in further redesigns and content creation. Providing a voice and tone for future iterations would ensure a smoother transition between designers and content writers.

Nathan Chan © 2025

Nathan Chan © 2025

Nathan Chan © 2025