Make this
studio yours.
Tonal Acre is a fictional studio built as a native Framer template. This guide takes you from the demo to your own work.
Replace the studio identity
Replace the studio identity
Update the wordmark, site title, descriptions, email address and Studio page. Use only the people, locations, clients and claims you can verify. Remove the fictional-studio notice after every remaining example has been replaced or is clearly labelled.
Update the wordmark, site title, descriptions, email address and Studio page. Use only the people, locations, clients and claims you can verify. Remove the fictional-studio notice after every remaining example has been replaced or is clearly labelled.
Add your projects
Add your projects
Open the Projects CMS collection. Each project has a title, slug, discipline, format, concept year, poster, summary, brief, contribution, deliverables and credits. Add the actual role your studio played. Publish a project only after its images, text and links are complete.
Open the Projects CMS collection. Each project has a title, slug, discipline, format, concept year, poster, summary, brief, contribution, deliverables and credits. Add the actual role your studio played. Publish a project only after its images, text and links are complete.
Update the project stage
Update the project stage
The homepage uses one native component with three discipline states: Music, Sound and Identity. Each has Desktop, Tablet and Phone layouts. Update every matching state’s image, project name, contribution and case link. These buttons choose a project; they do not play audio.
Add real media
Add real media
The homepage includes an original demo sound study, separately labelled from the fictional treatments. Replace it with audio you have permission to publish. Keep visible playback controls, descriptive titles and autoplay off. The case-study images remain non-playable unless you add genuine licensed media to those pages.
The homepage includes an original demo sound study, separately labelled from the fictional treatments. Replace it with audio you have permission to publish. Keep visible playback controls, descriptive titles and autoplay off. The case-study images remain non-playable unless you add genuine licensed media to those pages.
Connect your form
Connect your form
The demo recipient is kamnev.apps@gmail.com. Change the native form destination to your own address in Framer, then send a real test enquiry and confirm that it arrives. Check required fields, invalid email, sending, success and failure states. A success panel must appear only after the form reports a successful submission.
The demo recipient is kamnev.apps@gmail.com. Change the native form destination to your own address in Framer, then send a real test enquiry and confirm that it arrives. Check required fields, invalid email, sending, success and failure states. A success panel must appear only after the form reports a successful submission.
Set your privacy information
Set your privacy information
Before using the form for your own business, add your real privacy contact and a policy that describes the tools and data handling you actually use. Link that policy from the form and footer. This template does not invent your legal entity, retention period, analytics setup or privacy practices.
Before using the form for your own business, add your real privacy contact and a policy that describes the tools and data handling you actually use. Link that policy from the form and footer. This template does not invent your legal entity, retention period, analytics setup or privacy practices.
Keep the images deliberate
Keep the images deliberate
The three demo plates were created for fictional projects. Replace them with media you have permission to publish. Use descriptive alt text, check the wide and phone crops, and compress images without obscuring useful detail.
The three demo plates were created for fictional projects. Replace them with media you have permission to publish. Use descriptive alt text, check the wide and phone crops, and compress images without obscuring useful detail.
Check the final site
Check the final site
Visit every page at desktop and phone width. Open every project and menu link. Use the site with a keyboard, check focus, try all project-stage variants and confirm the form delivery. Check the 404 page using a route that does not exist.
Visit every page at desktop and phone width. Open every project and menu link. Use the site with a keyboard, check focus, try all project-stage variants and confirm the form delivery. Check the 404 page using a route that does not exist.
Need help with the template?
Send the page link and a short description of what you are trying to change.