Atelier Editorial gives small creative agencies and independent studios a complete portfolio structure they can edit and publish without a framework or build pipeline.

Complete live demo: https://ry-design-studio-atelier-editorial.netlify.app/

The template combines a strong work index with two genuinely different case-study patterns, clear service and process pages, a fictional studio profile, and an honest front-end inquiry demonstration.

Included Pages

1. Home - selected work and buyer-value overview
2. Work - filterable six-project contact sheet
3. Northline Commons - image-led place and culture case study
4. Luma Editions - modular identity and applications case study
5. Services - service scope, deliverables, and questions
6. Studio - fictional studio story, principles, and capabilities
7. Process - discovery-to-handoff working method
8. Contact - accessible inquiry-form demonstration

Buyer Features

• Eight connected responsive HTML pages
• Two reusable case-study storytelling patterns
• Six fictional projects with original local imagery
• Filterable work index with accessible pressed states
• Mobile navigation with keyboard and Escape support
• Local form validation with a truthful no-send demo disclosure
• CSS tokens for color, typography, spacing, and focus states
• Reduced-motion support, semantic markup, unique page metadata, and alternative text
• Self-hosted fonts and images with no runtime CDN dependency

Technology

• Semantic HTML5, modern CSS3, and Vanilla JavaScript
• No Bootstrap, jQuery, React, Tailwind, package manager, database, CMS, or build step
• No analytics, tracker, external form service, or undocumented network request

Documentation Included

• English README with setup, structure, customization, form integration, accessibility, hosting, and support guidance
• Asset provenance, credits, product license, two font licenses, and changelog

Requirements

• A current version of Edge, Chrome, Firefox, or Safari
• A text or code editor for customization
• Any static web host for publication

Important Limitations

• This is a static front-end template. It does not include a backend, CMS, database, account system, email delivery, analytics, payment, booking, or hosting service.
• The inquiry form validates locally but does not send or store data until the buyer connects an endpoint they control.
• All studio names, project names, dates, contact details, services, and business claims are fictional demo content and must be replaced before publication.
• Buyers are responsible for the license and accuracy of replacement media, fonts, and business content.

Quick Start

1. Extract the buyer ZIP and open index.html in a modern browser
2. Replace fictional project content, studio details, images, dates, and alternative text
3. Adjust the documented CSS design tokens for the required brand direction
4. Update navigation links on each page when changing the page set
5. Connect the inquiry form to a secure endpoint and add appropriate privacy, spam, failure, and success handling
6. Run final accessibility, content, and HTTPS checks before publication

Support

Support covers questions about the included source structure, documented customization points, and reproducible defects in the unmodified package. Custom installation, content entry, hosting administration, backend development, CMS integration, third-party services, and bespoke design work are not included.

Credits

Design, development, documentation, and original local project imagery by RY Design Studio. Space Grotesk and Playfair Display are included under the SIL Open Font License 1.1. No stock library, third-party logo, framework, CDN, tracker, or external runtime library is included.