ECE TNFC Lab

Despite being located inside the ECE department, TNFC, one of U of T's research labs, had its own infrastructure, and no connection to ECE's brand or navigation. I consolidated this multi-page site into a two-page section native to ECE's digital environment.

I was tasked with conducting a research and audit on the site to understand what could be done to improve the experience on the site and to propose a plan to integrate the TNFC lab into ECE's environment. I built and integrated the entirety of the TNFC lab as a two-page section within the ECE site.

The TNFC homepage when the project was greenlit.

UX Research and Content Audit

I audited the full existing site, every top-level page, every sub-page, every content item, against two questions: does this need its own page, or can it exist somewhere else? And if it needs its own page, what does that page actually do?

Most of the top-level pages were auto-generated link aggregators, not real content pages. The actual information was buried in sub-pages that users had to navigate to independently.

TNFC's User Access Page

TNFC's Access Forms Page

Decision-Making

I had to determine how TNFC should describe itself within ECE's ecosystem, what hierarchy the information should follow, and also write for two different audiences simultaneously.

Researchers who already knew TNFC

Prospective/First Time users

The original pages did not exist because the information required space, and stripping away the auto-generated architecture revealed two genuine content needs: a home page that explained what TNFC was and what it offered, and an access page that gave users everything they needed to book and use the facility.

Therefore, my Proposal sought to address these points:

Resolve standalone site identity

Increase content discoverability

Reduce maintenance overhead

Align with ECE branding

Simplify navigation structure

What I Built

View the High-fidelity mockups for the Two pages I created inside ECE's site.

My original proposal included equipment capabilities as a section on the home page, rather than a full page. After I left, the organization extended the architecture to add a third standalone page for that content.

Click on Image to view full mockup

TNFC Home

Explained what the lab was, what it offered, and positioned it clearly as a research facility. All original top-level page content consolidated into scannable sections.

Live Link

TNFC User Access

All forms, processes, policies, and compliance requirements in one place. Designed for users who needed to act, not browse.

Live Link

The Industry Opportunities page — two column card layout with departmental metrics for prospective students and industry partners

Click on Image to view full mockup

My Designs used space, layout, and focus to guide the user.

The Facilities was originally a subpage. I integrated it as a structured grid on the TNFC home page, reducing click depth.

TNFC's Facilities Page (Original)

What it looks like now

The Outcome

A Successful System Migration that reduced admin work.

The pages shipped as part of the ECE rebuild in March 2025. After I left, development on other parts of the ECE site reused components and patterns that were originally designed for TNFC's section, including the Grid Modernization Centre's new page.

View Live Site

The sections were picked up and used throughougt the site after I left. That's the proof that — not only were my components and patterns well-liked and aesthetically representative of the department — the structural decisions made sense and were repeatable.

Reduced technology debt

one environment instead of two, one content channel instead of two.

Reusable components

patterns designed for TNFC were extended to new pages after the project closed.

Content ownership established

content home inside ECE's ecosystem with a maintainable structure.

What I Learned

Every design decision was driven by the need to ensure ease of access to the regulations, including access, training, billing, and safety. At the same time, the pages were designed to feel native to ECE while also expressing TNFC’s identity and values. The result positions TNFC as a core, high-value research facility within the department.

A multi-page subsite for ECE's Toronto Nanofabrication Centre (TNFC), built for long-term ownership and evolution.