Maker Faire · Conceptual Website Redesign

Redesigning Maker Fairefor discoveryand participation.

A clearer digital experience for attendees, makers and curious first-time visitors — keeping the brand's playful energy while making its content easy to navigate and act upon.

Platform
Responsive website
Type
Conceptual redesign
Role
UX/UI Designer
Focus
UX audit → prototype
01Overview

One website, many very different goals.

Maker Faire brings together creators, inventors, artists, educators and families through interactive, hands-on events. Its website has to serve people with very different goals — from discovering events and buying tickets to exhibiting projects or simply learning what Maker Faire is.

This conceptual redesign explored how the site could keep Maker Faire's energetic identity while making its content easier to navigate, understand and act upon.

02Design Problem

Clarity without losing the play.

The site held a wide range of events, projects, stories and participation opportunities, but the sheer volume made it hard to scan. Different users arrived with different questions:

  • Where is the next Maker Faire?
  • What can I see and do there?
  • How can I exhibit my project?
  • How do I purchase tickets?
  • What exactly is Maker Faire?
How might we

…help different audiences quickly understand Maker Faire, discover relevant experiences and confidently take their next step?

03Role & Responsibilities

The website as an experience & content problem.

  • Auditing the existing website and content
  • Identifying primary audiences and user goals
  • Restructuring navigation and information architecture
  • Mapping key attendee and participant journeys
  • Wireframing major pages and reusable content patterns
  • Creating the responsive visual language and prototyping key interactions
04Process

Reorganised around user intent, not org structure.

Website audit→Audience mapping→Content prioritisation→IA→User flows→Wireframes→UI design→Prototype

The redesign was built around three primary needs:

  • Discover an event, maker or project
  • Plan a visit and understand what to expect
  • Participate as a maker, volunteer or community member
05Research & Insights

What each audience needed.

Different audiences, different entry points

An attendee hunting for tickets has a different goal from a maker applying to exhibit — the homepage had to acknowledge these paths early.

First-time visitors need context

Not everyone knows what a Maker Faire is; a concise intro, strong imagery and project examples explain the experience quickly.

Event info is task-oriented

Dates, locations, schedules and ticketing deserve prominence and shouldn't compete with editorial or promotional content.

Visual energy should aid navigation

The bold, unconventional identity is preserved — but a disciplined grid and hierarchy prevent visual overload.

Participation is a core journey

Maker Faire is about showing and making, not just attending — exhibit, volunteer and organise paths stay visible throughout.

06Ideation & Rough Sketches

Starting messy — mind maps, goals and moodboards.

Before any pixel, the redesign began with the fuzzy work — brainstorming what Maker Faire felt like, defining what success would look like, and pulling together a visual moodboard for the brand personality.

01 · Brainstorm — what does Maker Faire mean?
02 · Design goals
03 · Visual research & moodboard
04 · Feature concepts — the Wall, Calendar & rotating Homepage
07IA, Flows & Wireframes

Journeys mapped to intent — then a grid to hold them.

Attendee journey
1Home
2Find an event
3Event details
4Schedule
5Tickets

Prioritises planning info and shortens the path to ticketing.

Maker journey
1Home
2Participate
3Maker info
4Requirements
5Application

Introduces requirements before asking users to start an application.

Exploration journey
1Home
2Featured
3Project details
4Related

Supports visitors browsing for inspiration rather than planning a visit.

05 · Site map — four top-level sections
06 · Grid & low-fi wireframes
08UI Design & Visual Language

Bold personality, disciplined structure.

A restrained palette anchored around ginger red and cobalt blue, a single geometric sans, and a small kit of buttons, cards and icons — enough personality to feel like Maker Faire, structured enough to scale.

Colour & type system
Patterns & usage
UI kit — components

A clearer homepage hierarchy

A strong hero introduces Maker Faire, then clear pathways to discover events, explore projects and participate — top actions get visual priority, stories sit lower.

Modular content cards

A reusable card system for events, makers, projects, workshops and stories makes varied content scannable and scales across pages.

Stronger event discovery

Event cards surface location, date and type before a user opens the full event page.

Distinct calls to action

Find a Faire, Get Tickets and Become a Maker are visually differentiated so the next step is obvious.

Balanced brand expression

Bold type, colour and imagery keep the personality; a structured grid and spacing add order without feeling corporate.

Responsive layout

Modules reflow across screen sizes while preserving the same hierarchy and action priority.

09Final Screens

Homepage, Events, Makers & the Wall.

Each screen was designed against the wireframe grid — hero, presentation, ticket booking, latest news, partners and footer stacked in a scannable rhythm. Sub-pages inherit the same modular blocks.

Homepage — hero & presentation
Homepage — ticketing & news
Homepage — partners & footer
Events — landing & next event
Events — calendar view
Makers — world map & filters
Makers — gallery & booking
The Wall — onboarding
The Wall — live canvas & tools
Responsive — mobile navigation & feed
10Prototype & Interaction

Motion that reinforces the play.

The prototype showed how users move between discovery, event planning and participation. Motion reinforced the brand character while keeping important actions predictable.

  • Navigation transitions between major sections
  • Hover states for event and project cards
  • Responsive menu behaviour and clear selection feedback
  • Animated section transitions and progressive reveal of event info
  • Consistent interaction patterns across cards and CTAs
11 · Design Impact

A clearer UX direction, before styling.

Organised the website around user intent
Reduced competition between content and actions
Clarified the paths for attendees and makers
Improved visibility of event-planning information
Created a reusable structure for varied content
Balanced brand personality with functional usability

A conceptual redesign — presented as UX outcomes, with no production metrics claimed.

12Learnings
  • Design for multiple intents — clear entry points stop one journey from dominating.
  • Information architecture shapes the interface — reorganising content came before the visual system.
  • Brand expression needs restraint — structure and whitespace make expressive content more powerful.
  • Event websites should reduce uncertainty — surface where, when, what and how early.
  • UX can preserve emotion — make the excitement easier to navigate, not simpler or corporate.