Nightly Framer Template

About this template

Nightly is a portfolio and résumé for software engineers who would rather show a number than an adjective.

The first visit opens on a waterfall: the page's own requests drawn as bars while they load, with the milliseconds counting, and when the page is ready the bars open onto it. The numbers are real, read from the visitor's browser, and the footer reports the same figure.

Then the home page opens on one sentence. As the visitor scrolls, five edits are applied to it: the filler words are struck out, the wording tightens, and the last edit adds the result of your featured project and its cover, straight from the CMS. Below it, each section arrives as a wireframe and goes live as it is reached.

The rest of the page keeps to the same idea. Projects are written as a diff, the old number struck out beside the new one. Posts are a release log, numbered automatically. Services hang off branch lines that merge back into the contact line. Testimonials are a review thread, each one approved. A screenshot folds from desktop to tablet to phone as you scroll, and the closing number rolls from where a client started to where it ended.

What is included

· 12 pages: Home, Work, case study, About, Services, service detail, Writing, post, Contact, Legal, 404 and a Style guide

· 7 CMS collections: Projects, Experience, Services, FAQs, Writing, Testimonials, Legal

· 11 code components with plain controls, including the preloader, and 4 canvas components (Navigation, Button, Submit Button, FAQ Row)

· Colour styles and text styles throughout, with three alternate palettes ready to copy

· Desktop, tablet and phone layouts on every page

· A working contact form with pending, success and failed states

· Four Framer Agent skills: the design rules, add a project, add a page, rebrand

· A preloader that plays once a visit and can be switched off in one field

· Dark only. Respects reduced motion.