Frame Studio: Design Studio Website Template in Framer by Kazi Mohammed ErfanFrame Studio: Design Studio Website Template in Framer by Kazi Mohammed Erfan
Frame Studio: a website template for design studios, built in Framer
Frame Studio is a website template for creative agencies and design studios, in black and white with burnt orange sections. We built it in Framer with home, about, work, blog and contact pages, a CMS for projects and posts, and a step-by-step project form.
Type: Website template we built in Framer · Industry: Design studios, creative agencies · What we did: Framer development · Platform: Framer · Live: framedx.framer.website
About the template
Frame Studio is made for studios that sell brand strategy, motion, video, 3D, advertising and web design. The sample studio, “Frame®”, introduces itself as “A design studio crafting timeless” and cycles through solution, design, motion, strategy and naming.
The challenge
A studio needs a site that shows its taste, proves its track record and turns visitors into project inquiries.
The look has to stand out. Studio templates are a crowded category, so the first screen has to be bold.
Proof has to be visible. Work, awards, client numbers and testimonials all need a place.
Inquiries need detail. A plain contact form gives a studio too little to quote from.
The team must update it. Projects and blog posts have to go live without a developer.
What we did
A home page that shows range and proof
Built the hero with a rotating word after “A design studio crafting timeless”.
Built the services list as a hover-reveal: Brand strategy, Motion graphic, Video editing, 3D Animation, Advertising and Web design.
Set up the work grid as a CMS collection with six sample projects, each with its own page.
Set up the blog, “Straight to the bold ideas”, as a second collection with three sample posts.
A contact page that asks the right questions
Built a six-step project form: full name, email, timeline, budget, services and more information.
The services step lets visitors pick Brand Strategy, Web Design, Content Creation, Digital Marketing or Creative Direction.
About page, footer and every screen size
About page with “Mission and Vision”, studio numbers and a team of four with roles.
Footer with a “Get Notified” newsletter signup, social links and a 404 page.
Layouts and animations tuned for desktop, tablet and phone.
Scope
Included:
Five pages: home, about, work, blog and contact, plus a 404 page
CMS collections for work and blog, with detail pages
Six-step project inquiry form and newsletter signup
Scroll and hover animations, and layouts for desktop, tablet and phone
Not included:
Custom design for one studio: this is a ready-made template
The buyer's own projects, copy and domain: the demo uses sample content
Connecting the newsletter to an email tool: the buyer chooses their own
Listing and selling the template: our part was the Framer build
Results
Live as a demo at framedx.framer.website.
Five main pages, six project pages and three blog posts from the CMS.
A studio can add work and posts in Framer without code.
What we'd improve next
Add a services page with one detail page per service, so each service can rank and be linked on its own.
Add a work filter by service, such as motion or web design.
Add a careers page with open roles from a CMS collection.
Working on something similar?
I design websites in Figma and build them in Framer or Webflow, so your team can edit every page without a developer. Message me here on Contra with your site or Figma file, and I'll reply with a plan and a fixed price.