First Lady Website
- Credits
-
Nick Adam
Design DirectionKevin Moreland
DesignDanielle LeComte
Web Development
While rebranding First Lady, Span reimagined and rebuilt the website from the hull up. Translating the new brand identity into a digital experience that reflects the grace, clarity, and refinement of being aboard a sightseeing tour. The website is a study in balance: elevated in design, precise in function. Visitors are immersed in a refined interface that echoes the heritage of First Lady’s fleet: ornamental borders, expressive typography, and graceful motion create a digital experience as considered and iconic as the boats themselves.
Built on Craft CMS, the website features a fully custom content model and modular page builder tailored to First Lady’s needs. This gives the internal team intuitive control over layout, editorial storytelling, and seasonal updates—preserving the integrity of the design system while offering flexibility across offerings. To power the visitor experience, Span integrated real-time ticketing via Ticketmaster and sightseeing e-commerce via Ventrata. Guests can explore daily architecture tours, book specialty cruises, or browse fleet history with ease and confidence.
The front-end, developed with Tailwind CSS and Alpine.js, is fast, responsive, and quietly expressive—layering subtle transitions, video hover states, and interactive touches that reward curiosity. Behind the scenes, reusable content blocks and structured relationships reduce duplication and streamline updates, enabling even non-technical users to manage the site with ease. Navigation is clear, scalable, and future-ready—designed to evolve alongside First Lady’s seasonal offerings and long-term ambitions. Whether reserving a twilight cruise or discovering the legacy of Chicago’s most iconic vessels, every interaction is shaped by the same care and elegance found onboard.
FirstLady.com
The new identity and website position First Lady as the gold standard of Chicago experiences.