Independent concept / Non-commercial prototype

NGP SHED

A concept for a little digital shed: catch the thought, find the garden, and keep the useful things together.

UI / UXInteractive prototypeGSAP motion
NGP SHED design illustration with a yellow capture panel and green and lilac garden notebook cards
Save first. Sort later.
The idea

Community gardening comes with small things to remember: bring gloves, order compost, call someone back, save a receipt. The Shed gives those loose ends somewhere easy to land.

The design response

Start with one welcoming Home screen, a capture field that asks very little, and a notebook for each garden. Organising can happen afterwards. The prototype explores that flow before adding more features.

Inspired by NGP’s existing identity.

Handmade character / Clear interactions
Original NGP Boulevard Gardens poster with handmade lettering, yellow details and a lilac background
Original poster by Nottz Garden Project, shown as reference material. Poster design is not my work; its dates are not the demo schedule.

Keep the rough edges.

NGP’s existing posters set the direction: bold ink lettering, yellow highlights, green and lilac, and a handmade community feel. The interface borrows that character while giving forms and notes room to breathe.

Refinement meant making dropdown arrows clearer, keeping capture visually dominant, and cutting repeated copy. Supporting cards became quieter so every panel does not compete for attention.

Colour values are guided by the references, rather than presented as official brand specifications.

01

Catch the thought

Chuck a note straight into the Shed. Choose a type or garden when you're ready.

02

Find the garden

Open a garden notebook for its sample sessions, jobs and linked captures.

03

Learn by doing

A short tour lets people practise saving, sorting and ticking without changing real records.

Have a go in the Shed.

The working app / Not a video

Add a thought, sort it, or open a garden. Sessions and jobs are samples; notes you capture stay in this browser when storage is available.

Live prototype · sample data
Open live page ↗

Boots on. Kettle on.

The working Shed loads here as you scroll. Prefer it bigger? Open the live page.

The app uses short GSAP animations for feedback, with reduced-motion and animation-library fallbacks. The full window view gives phones more room.

A first seedling, with room to grow.

Current limits / Future potential
What works today

Today, quick capture, four garden notebooks, saved job ticks, optional sorting and a five-step tour. The app is a static prototype with browser storage, not a shared team service.

What would come next

Recover unfinished drafts, edit and archive notes, and complete captured Tasks. Then test real schedules, Calendar, Impact and shared access with NGP. These are possibilities, not features already delivered.

The full app guide

Functions, architecture, design decisions and a phased roadmap.

Read the PDF ↗

Have a project in mind?