A creative launch kit that turned a hardware reveal into pre-orders
A complete launch design package (3D renders, an interactive landing page and social collateral) that drove 15,000+ pre-orders in 72 hours.
The shape of the work
- Industry
- Professional Services
- Duration
- 8 weeks
- Cooperation model
- Fixed price, phased
Client name withheld under NDA. Engagement details are shown to the extent our agreement permits.
Every surface, in order
The Aether One specification page: ten figures in a single table, the five things that actually come in the box, and the three steps a measurement takes.
The kit page listing all seven launch assets with format, length and size, the channels each is licensed to run in, and the six signed off before the reveal beside the retail loop still held.
The public results page fourteen days on: 1,842 reservations placed after the 72-hour pre-order window, split by where they came from and by the film or still last viewed, with the 15,000+ launch pre-orders counted separately above.
The interactive viewport that held visitors for four minutes twelve: drag to spin the instrument, tap a marked point to see what sits behind the grille, here the sealed sensor bay.
The embargoed press and keynote kit: four downloads on one page, each with its own usage terms, the pack's own numbers, and the running order of the founder's 38-slide unveil deck.
The internal launch desk at the close of the 72-hour window: 15,000+ pre-orders, 4m 12s dwell and 18 outlets, each weighed against the previous launch, as reservations landed from checkout.
The brief
A hardware maker was launching its flagship device. We produced the complete launch kit: 3D assets, keynotes, and a high-converting web reveal page.
The device had been in development for two years and the reveal date was fixed by a conference slot. What existed were engineering prototypes on a bench under fluorescent light and a CAD file. No studio photography, no launch page, no press pack, and eight weeks. The constraint that shaped everything was that the hardware couldn't be photographed at all: the units that existed weren't the units that would ship.
Creative Direction & Web
What people were running into
- 01
There were pre-production hardware prototypes but no studio product photography or launch marketing collateral to showcase the breakthrough technology.
A pre-production unit differs from the shipping one in exactly the details a close-up shows: a seam, a finish, an unfinished port. Photographing them would have produced marketing material that had to be reshot after launch, and a founder on stage holding a device that didn't match the pictures behind him is the specific failure the whole kit was built to avoid.
We rendered studio 3D models of the hardware, engineered an interactive WebGL launch page, and built a press-ready media kit.
Design decisions
Modeled photorealistic 3D renders and exploded assembly views
The chassis was rebuilt in Blender from the released CAD, so tolerances and the exploded assembly matched the part itself, not an artist's reading of it.
Designed an interactive WebGL 360-degree product launch page
The 3D model was decimated to a streamable mesh and driven in a WebGL canvas, so the reveal page held real geometry instead of a pre-rendered turntable.
Created social media campaign kits and press media packages
Every social and press asset was exported from one Figma library bound to the launch page's own tokens, so nothing could drift between channels.
Designed live keynote slides for the founder's unveil event
The keynote deck was built from the render library itself, not from screenshots of it, so the slides behind the founder were the same files as the page.
Phase by phase
Phase 1: Product Narrative & Strategy
Hardware Reveal & Campaign Plan
Audited the hardware specs, target developer demographics, and launch campaign channels.
- Product Narrative Spec
- Launch Channel Map
- Campaign Timeline
Phase 2: 3D Modeling & Motion Graphics
Photorealistic Render & Motion Suite
Modeled photorealistic 3D product renders, animated demo videos, and social graphics in Blender and After Effects.
- 3D Render Library
- Motion Graphics Kit
- Figma Asset System
Phase 3: WebGL Interactive Launch Page
360-Degree Web Viewport & Pre-Orders
Built a high-impact product landing page with interactive 3D canvas viewport and pre-order registration.
- Interactive Launch Web Page
- Pre-Order Checkout Engine
- 3D Canvas Viewport
Phase 4: Keynote Unveil & Press Blitz
Live Keynote & Media Kit Handoff
Supported live keynote unveil, driving 15,000+ pre-orders in the first 72 hours across major tech outlets.
- Keynote Presentation Deck
- Press Media Kit
- Launch Performance Dashboard
The launch plan: four phases over eight weeks to a reveal date fixed by a conference slot, copy locked at week five, and three CAD revisions, each re-rendered and propagated to page, deck and press pack.
Photorealistic 3D Hardware Renders
Studio-quality 3D renders and exploded chassis assembly animations.
The chassis was rebuilt in Blender from the mechanical CAD instead of modeled by eye, so the render and the shipping part share the same tolerances. A three-point studio rig and a physically based aluminum shader were locked once and reused across every frame, which is why the stills, the exploded assembly and the launch page read as one photo shoot instead of three. Masters came out at 6K so a single file served press, print and web.
- CAD-derived geometry, never remodeled by eye
- One locked lighting rig across every frame
- 6K masters cut down for press, print and web
The render library: the exploded assembly rebuilt from CAD rev D with its eleven parts, the locked three-point rig and aluminum shader every frame reuses, one 6K master cut for press, print and web, and the six-shot list.
The viewport build: a 40k-triangle glTF with baked lighting, the grille marker holding its vertex at two rotations, the four hotspots by vertex name, and the static render held on a cold connection until the mesh lands.
Interactive 3D Web Viewport
Canvas WebGL page allowing buyers to rotate and inspect the device in 360 degrees.
The viewport isn't a video. The Blender model was decimated to a 40k-triangle glTF with baked lighting and streamed into a WebGL canvas, so the visitor drags the actual geometry instead of scrubbing a pre-rendered turntable. Hotspots are anchored to named vertices, which keeps a marker sitting on the vent at any angle. On a cold mobile connection the canvas holds a static render until the mesh lands.
- 40k-triangle glTF with baked lighting
- Hotspots anchored to vertices, not screen coordinates
- Static render held until the mesh streams in
Comprehensive Press & Keynote Kit
The token library: the same locked headline on the launch page, keynote slide 10 and a 9:16 social card, the tokens behind all three, and the usage terms each of the four press downloads carries.
High-res media assets, keynote presentation decks, and social campaign graphics.
Every asset in the kit came out of one Figma library wired to the same tokens as the launch page, so a headline set for the keynote and the same headline on the web couldn't drift apart. Journalists got a single embargoed page with four downloads instead of a folder dump, each carrying its own usage terms. The founder's deck was built from the render library itself, never from screenshots of it.
- One token library behind deck, page and social
- Single embargoed page, four packaged downloads
- Usage terms travelling with each asset
What moved after the redesign
15,000+
72-hour pre-orders
4m 12s
Avg dwell time
18 outlets
Press coverage
Pre-orders are the count from the reveal to seventy-two hours after it, taken from the checkout rather than from the marketing dashboard. Dwell time is the median session on the launch page over the same window, and coverage counts outlets that published from the embargoed pack rather than every mention of the device.
Client name withheld under NDA. Figures are approximate, drawn from the engagement’s own reporting.
Principles that held
- 01
Launch creative kit drove 15,000+ hardware pre-orders in 72 hours.
The reveal page and the checkout were one system, so a visitor convinced by the viewport didn't have to go and find somewhere to buy.
- 02
Interactive 3D viewport web page engaged visitors with 4m 12s average dwell time.
Interaction held attention where video wouldn't: visitors chose what to look at, and the marked points gave them a reason to keep choosing.
- 03
Unified media kit secured press coverage across top tech publications.
One embargoed page with four packaged downloads beat a folder of assets. Journalists on a deadline publish what's ready, not what needs assembling.
How design and engineering worked together
A cross-functional team of 3 worked on a fixed price, phased basis over 8 weeks, covering 3D rendering, Launch landing page, Social & press kit. We ran a standing mid-week checkpoint and written decisions in place of status meetings. Nothing shipped without a live demo first.
We worked from the mechanical team's CAD releases instead of a brief, which meant the renders moved whenever the hardware did. Three revisions landed during the engagement and each one propagated automatically. Copy was locked at week five so the keynote deck, the page and the press pack could be built from one approved set of strings, with no three versions drifting apart.
Four marked points, any angle
A marker that belongs to the part, not to the screen
The viewport held real geometry, and each marked point was pinned to a named vertex, so it stayed on the grille however far a visitor spun the instrument. Choose a point to turn to it and see what sits behind, drag to spin, then switch the anchor to screen position and watch the markers slide off. Switch tabs, or use the arrow keys once one is focused.
Marked point 1 of 4
Grille
A machined front grille of 312 holes, and the intake fan right behind it.
- 312 holes, 1.1 mm
- Intake fan, 22 dBA
- Air path front to rear
vertex v_grille_front · #18204
A stylized drawing standing in for the WebGL viewport, not the viewport itself. Rotation angles, turn timing and vertex names are illustrative.
From one CAD release to a reservation
The hardware couldn't be photographed: the units that existed weren't the units that would ship. So every picture, slide and page was built from the part itself, through the same five stages, and moved when the part did.
- 01 · Source
Released mechanical CAD
- The mechanical team's CAD releases, not a brief
- Three revisions landed during the work
Each revision propagated to the renders automatically
- 02 · Ingestion
Blender render library
- Chassis rebuilt from the CAD, not by eye
- One locked three-point rig, one aluminum shader
- 6K masters
Render and shipping part share the same tolerances
- 03 · Engine
One Figma library
- Bound to the launch page's own tokens
- Copy locked at week five
- Deck built from the render library itself
Keynote, page and social can't drift apart
- 04 · State
Mesh and embargoed pack
- Model decimated to a 40k-triangle glTF, lighting baked
- One embargoed page, four packaged downloads
Usage terms travel with each asset
- 05 · Delivery
Reveal page and checkout
- Real geometry in a WebGL canvas
- Hotspots anchored to named vertices
- Pre-order checkout in the same system
A static render holds until the mesh lands
Licensed, embargoed, still standing
Usage rights, embargo & launch-day load
Terms travel with the file
Every asset came out of one Figma library, and each press download carries its own usage terms, so a still or a film picked up on its own still says where it may run. The kit page lists every asset against its channels.
One embargoed page, not a folder
Journalists got a single embargoed page with four packaged downloads instead of a folder of loose files. Coverage is counted only from outlets that published from that pack: 18 of them.
The page never waits on the mesh
The viewport streams a 40k-triangle glTF with baked lighting in place of a heavy video, and on a cold mobile connection a static render holds the frame until the mesh lands. Checkout sits in the same system, so a convinced visitor reserves without leaving.
A fixed reveal date and hardware you can’t photograph yet? Scope your build in 3 minutes.
Scope your buildNearby engagements
AI & AutomationA private legal assistant grounded in verified precedents
A private knowledge assistant that searches internal case files and precedents, providing cited answers legal teams can verify in seconds.
Legal & Law Firms · 14 weeks
Product DesignAn onboarding flow that guides trial users to value
A redesigned SaaS trial onboarding experience with progressive checklists, sample data, and inline guidance that turns signups into active subscribers.
Professional Services · 10 weeks
Product DesignA design system that brought speed and consistency to 4 product teams
A token-based design system in Figma and React that eliminated component duplication across 4 product squads and cut the time from design handoff to merged frontend.
Professional Services · 14 weeks
Let's talk
Running a large platform, shaping a first MVP, or getting a product ready for a funding round? Tell us where you are. We'll shape the process around it, and stay with you after launch.
