← Case Studies
Emmalee Alexander Print Design icon

Emmalee Alexander · Print Design

A portfolio site for a Frankfort, Michigan print designer - custom business cards, flyers, and invitation suites. Filterable work gallery, flip-card process section, pricing, a reviews carousel, and a no-code admin panel - built from scratch in plain HTML, CSS, and vanilla JavaScript.

HTML · CSS · JavaScript · GitHub Pages · 2026 · Freelance
Role
Solo build
Client
Print designer - Frankfort, MI
Stack
No framework, no build step
Status
Live on GitHub Pages

The Problem

Emmalee Alexander designs custom business cards, flyers, and invitation suites - physical print work that's made to be held. But her portfolio lived in photos and DMs. There was no single place to send a potential client to see the range of her work, understand her process, check pricing, or reach out. Print design is a referral business, and referrals need a link.

The goal: a portfolio site that feels like her work - warm, tactile, and personal rather than a generic template - and that she can update herself without touching code.

Live Preview

geoclink.github.io/business-card-portfolio

Live embed - scroll inside to explore. Open in a new tab ↗ for the full experience.

Live Preview

9:41

Open full screen ↗

geoclink.github.io/business-card-portfolio

The Approach

Plain HTML, CSS, and vanilla JavaScript - no framework, no build step. The design leans into print: a soft blush palette, serif display type, and a floating business-card hero that tilts like a card on a table. The work gallery filters by category (business cards, flyers, invitations), the process section uses flip cards, and reviews rotate in a carousel.

Technical Implementation

No-Code Admin Panel

A password-gated admin.html lets Emmalee edit the site without a developer: about copy, contact details, process step text, work gallery items, and reviews are all editable, with changes persisted in localStorage under a versioned data schema. She can also switch the site's entire font pairing from a preset list - the choice loads dynamically via a Google Fonts <link> injected at runtime.

Filterable Gallery

Work items are data, not markup - a JavaScript array renders the gallery, so the category filter (All / Business Cards / Flyers / Invitations) is a re-render rather than DOM show-hide, and adding a piece from the admin panel is just adding an item to the array.

SEO & Sharing

Full meta setup: unique description, Open Graph and Twitter Card tags with a custom 1200×630 share image, canonical URL, a ProfilePage Schema.org JSON-LD block, and an inline SVG favicon with no extra request.

Her Work, In Motion

A walkthrough of the live site - the tilting business-card hero, the filterable work gallery, flip-card process section, pricing, and reviews.

Presented the way her work ships - like a print proof on the table

The Outcome

Emmalee now has a storefront: one link that shows her range, explains how a project works, states her pricing, and ends in a contact. The gallery features real delivered work - including the White Bear Harmonics business card, designed for the same Michigan wellness client whose booking platform I built on Small Business Suite.

Because the site is static and content lives in the admin panel, there's nothing to maintain - no server, no database, no hosting bill. It ships from a public GitHub repository via GitHub Pages.

Live Site

Emmalee Alexander Print Design
geoclink.github.io

Emmalee Alexander · Print Design

Custom business cards, flyers, and invitation suites from Frankfort, MI. Made to be held onto.

Need a website for your business? I take on select freelance web projects.

Let's talk →