Website
Website
Website
Community Saas
Community Saas
Community Saas
Brown House Productions
Brown House Productions
Brown House Productions
Turning a production company's work into a website that could sell it.
Turning a production company's work into a website that could sell it.
Turning a production company's work into a website that could sell it.
A responsive production company website designed and built in Framer to showcase work, communicate services
and create a credible destination for potential clients.
A responsive production company website designed and built in Framer to showcase work, communicate services
and create a credible destination for potential clients.
A responsive production company website designed and built in Framer to showcase work, communicate
services and create a credible destination for potential clients.
Role
Role
Role
Web Designer · Framer Developer
Web Designer · Framer
Developer
Web Designer · Framer Developer
Tools
Tools
Tools
Framer, ChatGPT
Framer, ChatGPT
Framer, ChatGPT
Status
Status
Status
Live
Live
Live
Platform
Platform
Platform
Responsive Website
Responsive Website
Responsive Website
Timeline
Timeline
Timeline
April - July 2026
April - July 2026
April - July 2026
Overview
Overview
Overview
Why this Product
exists
Why this Product
exists
Why this Product
exists
Brown House Productions had the work and expertise.
What they needed was a professional digital home that could communicate that value to potential clients.
The website needed to do more than look good.
It needed to answer:
What does Brown House do?
What have they worked on?
Why should I trust them?
How can I contact them?
The goal was to turn the website into a practical sales and credibility tool.
Brown House Productions had the work and expertise.
What they needed was a professional digital home that could communicate that value to potential clients.
The website needed to do more than look good.
It needed to answer:
What does Brown House do?
What have they worked on?
Why should I trust them?
How can I contact them?
The goal was to turn the website into a practical sales and credibility tool.
Brown House Productions had the work and expertise.
What they needed was a professional digital home that could communicate that value to potential clients.
The website needed to do more than look good.
It needed to answer:
What does Brown House do?
What have they worked on?
Why should I trust them?
How can I contact them?
The goal was to turn the website into a practical sales and credibility tool.
My Role
My Role
My Role
I independently handled the design and setup of this project
I independently handled the design and setup of this project
I independently handled the design and setup of this project
My responsibilities included:
My responsibilities included:
My responsibilities included:
UX research
Sitemap / page structure
User flow
UI design
Responsive design
Framer development
CMS/content setup
Domain setup
Analytics setup
Client feedback
Iteration
Final deployment
UX research
Sitemap / page structure
User flow
UI design
Responsive design
Framer development
CMS/content setup
Domain setup
Analytics setup
Client feedback
Iteration
Final deployment
UX research
Sitemap / page structure
User flow
UI design
Responsive design
Framer development
CMS/content setup
Domain setup
Analytics setup
Client feedback
Iteration
Final deployment
Problem & Solution
Problem & Solution
Problem & Solution
What we were
solving
What we were
solving
What we were
solving
The Problem
The Problem
The Problem
The existing digital presence didn't provide the level of presentation and structure needed for a professional production company.
Potential clients needed a simple way to:
Understand the company
Explore previous work
Understand services
Build trust
Find social channels
Make contact
The challenge was creating a polished experience while keeping the website easy to maintain and responsive across devices.
The existing digital presence didn't provide the level of presentation and structure needed for a professional production company.
Potential clients neede a simple way to:
Understand the company
Explore previous work
Understand services
Build trust
Find social channels
Make contact
The challenge was creating a polished experience while keeping the website easy to maintain and responsive across devices.
The existing digital presence didn't provide the level of presentation and structure needed for a professional production company.
Potential client needed a simple way to:
Understand the company
Explore previous work
Understand services
Build trust
Find social channels
Make contact
The challenge was creating a polished experience while keeping the website easy to maintain and responsive across devices.
Defining The Experience
Defining The Experience
Defining The Experience
I researched how production companies and creative studios present themselves online and used those patterns to structure the website.
The experience was designed around:
Show the work → Explain the capability → Build trust → Make contact
I also suggested additional elements that could improve credibility and conversion beyond the initial requirements.
I researched how production companies and creative studios present themselves online and used those patterns to structure the website.
The experience was designed around:
Show the work → Explain the capability → Build trust → Make contact
I also suggested additional elements that could improve credibility and conversion beyond the initial requirements.
I researched how production companies and creative studios present themselves online and used those patterns to structure the website.
The experience was designed around:
Show the work → Explain the capability → Build trust → Make contact
I also suggested additional elements that could improve credibility and conversion beyond the initial requirements.
Design Process
Design Process
Design Process
The Learning
Curve
The Learning
Curve
The Learning
Curve
Framer was new territory for me professionally.
There was a lot of figuring things out as I went.
I leaned heavily on experimentation, documentation, YouTube tutorials, questions to experienced designers and developers, and a lot of hands-on problem solving.
The biggest challenge wasn't simply getting the desktop design right.
It was making sure the experience actually worked across screen sizes.
The website went through multiple rounds of responsive adjustments before reaching its current state.
Framer was new territory for me professionally.
There was a lot of figuring things out as I went.
I leaned heavily on experimentation, documentation, YouTube tutorials, questions to experienced designers and developers, and a lot of hands-on problem solving.
The biggest challenge wasn't simply getting the desktop design right.
It was making sure the experience actually worked across screen sizes.
The website went through multiple rounds of responsive adjustments before reaching its current state.
Framer was new territory for me professionally.
There was a lot of figuring things out as I went.
I leaned heavily on experimentation, documentation, YouTube tutorials, questions to experienced designers and developers, and a lot of hands-on problem solving.
The biggest challenge wasn't simply getting the desktop design right.
It was making sure the experience actually worked across screen sizes.
The website went through multiple rounds of responsive adjustments before reaching its current state.
Design Process
Design Process
Design Process
Key product
decisons
Key product
decisons
Key product
decisons
The work needed to lead
The work needed a lead
The work needed a lead
For a production company, the portfolio is the strongest proof of capability.
The visual hierarchy therefore gives the work significant space rather than burying it beneath excessive copy.
For a production company, the portfolio is the strongest proof of capability.
The visual hierarchy therefore gives the work significant space rather than burying it beneath excessive copy.
For a production company, the portfolio is the strongest proof of capability.
The visual hierarchy therefore gives the work significant space rather than burying it beneath excessive copy.
Credibility needed to be built into the experience.
Credibility needed to be built into the experience.
Credibility needed to be built into the experience.
Beyond showcasing projects, I recommended features and content structures that would help potential clients understand the company's capabilities and take the next step.
Beyond showcasing projects, I recommended features and content structures that would help potential clients understand the company's capabilities and take the next step.
Beyond showcasing projects, I recommended features and content structures that would help potential clients understand the company's capabilities and take the next step.
Responsive wasn't an afterthought.
Responsive wasn't an afterthought.
Responsive wasn't an afterthought.
The website was designed and tested across different screen sizes, with multiple iterations made specifically to improve mobile and tablet experiences.
The website was designed and tested across different screen sizes, with multiple iterations made specifically to improve mobile and tablet experiences.
The website was designed and tested across different screen sizes, with multiple iterations made specifically to improve mobile and tablet experiences.
Impact
Impact
Impact
What the
work achieved
What the
work achieved
What the
work achieved
The website is fully functional and live.
The website is fully functional and live.
The website is fully functional and live.
Brown House can now use the website as a central destination when referring clients and potential clients to the business.
Brown House can now use the website as a central destination when referring clients and potential clients to the business.
Brown House can now use the website as a central destination when referring clients and potential clients to the business.
The site is receiving visits across its pages through analytics, providing the company with a clearer digital footprint.
The site is receiving visits across its pages through analytics, providing the company with a clearer digital footprint.
The site is receiving visits across its pages through analytics, providing the company with a clearer digital footprint.
The client was pleased with the outcome and has already referred me to others, while also planning future website expansion as the company takes on more projects.
The client was pleased with the outcome and has already referred me to others, while also planning future website expansion as the company takes on more projects.
The client was pleased with the outcome and has already referred me to others, while also planning future website expansion as the company takes on more projects.
Reflection
Reflection
Reflection
Key learnings
Key learnings
Key learnings
Brown House was important to me because it was my first professional Framer build.
It forced me to stop treating no-code tools as something to "learn first" and start treating them as tools to solve real client problems.
I learned by building, breaking, researching, asking questions and fixing things.
That experience significantly increased my confidence in taking a product from Figma to a functioning production website.
Brown House was important to me because it was my first professional Framer build.
It forced me to stop treating no-code tools as something to "learn first" and start treating them as tools to solve real client problems.
I learned by building, breaking, researching, asking questions and fixing things.
That experience significantly increased my confidence in taking a product from Figma to a functioning production website.
Brown House was important to me because it was my first professional Framer build.
It forced me to stop treating no-code tools as something to "learn first" and start treating them as tools to solve real client problems.
I learned by building, breaking, researching, asking questions and fixing things.
That experience significantly increased my confidence in taking a product from Figma to a functioning production website.
Next Project
Next Project
