Resources

Everything I have published in one place: articles, the repositories behind them, and the design and development files other people can pick up and use.

01Writing02Open source03Design & dev resources

Design & dev resources

12 of 12

Figma Community files and developer tools. Hover or arrow through the list to preview; Enter opens the source.

12 results

Event Ticket Booking UIA three-step, login-free ticket booking flow built as a practice brief. Ships with a component breakdown and a spec covering state management, file uploads, payment webhooks and QR validation, so frontend and backend developers can each take a slice.Figma fileSoftware development
Fully Editable Tailwind Design SystemA Tailwind-aligned design system with local variables wired through it, so tokens change in one place. The most duplicated file on the profile.Figma fileLibraries
Wedding Invitations + Editable AssetsA set of editable wedding invitation layouts and assets, published so other designers could pick up a starting point rather than begin from a blank page.Figma filePrint
Creative's Paykit 2.0Quotation, invoice and contract templates for freelancers — the paperwork side of creative work, laid out so it can be edited and sent the same day.Figma fileTemplates
Mastering Drop Shadow CalculationA teaching file on how drop shadows are actually calculated in Figma — offset, blur and spread as a system rather than guesswork. Paired with a YouTube walkthrough.Figma fileEducation
Expense Tracker AppA personal finance app UI published as a clonable practice project, in the same dev-mode-ready format as the ticket booking brief.Figma fileSoftware development
Social Media Video Streaming AppA streaming app UI built as a free developer resource for HNG12 and open to any bootcamp, spanning mobile and web and deliberately framework-agnostic.Figma fileSoftware development
MCP Coding AssistantMCP server that feeds project documentation to a coding agent so its suggestions stay grounded.Dev toolJavaScript
roomKitVoice and video rooms where humans and AI agents join through the same API, with LiveKit handling WebRTC.Dev toolTypeScript
OpenAdapterLocal server that exposes the Claude.ai web interface as an OpenAI-compatible chat completions API.Dev toolJavaScript
PRISM StudioBrowser-based editor for design tokens that exports to CSS, Tailwind, SCSS or DTCG JSON.Dev toolTypeScript
Witch Text EditorA rich-text blog editor built on TipTap, with tables, task lists and embeds.Dev toolTypeScript

Figma file

Event Ticket Booking UI

Event Ticket Booking UI

A three-step, login-free ticket booking flow built as a practice brief. Ships with a component breakdown and a spec covering state management, file uploads, payment webhooks and QR validation, so frontend and backend developers can each take a slice.

Category
Software development
Updated
2024
Likes
53
Duplicates
1,500
Licence
CC BY 4.0
Built for
Developers to clone and build against
  • frontend
  • backend
  • practice
  • free template
Open in Figma Community (opens in a new tab)

Pinterest boards

11 boards · 239 pins

The visual reference library — patterns, components, charts and interactions I collect while designing. Swipe, or use the arrows, to page through a board.

Design Assets (opens in a new tab)

25 pins

WebApps (opens in a new tab)

25 pins

Components (opens in a new tab)

25 pins

Zero-Hero valued tips (opens in a new tab)

25 pins

AI webapp (opens in a new tab)

24 pins

Bitsaac website (opens in a new tab)

24 pins

patterns (opens in a new tab)

24 pins

twenti5th (opens in a new tab)

24 pins

Widgets (opens in a new tab)

23 pins

interactions (opens in a new tab)

12 pins

Charts (opens in a new tab)

8 pins