Glacier Studio

Web

5 min read

Glacier Studio is an architecture practice that wanted a website as calm and precise as its buildings. The old site was a slow gallery with no structure, and new clients could not tell what the studio actually did or how to start a project.

The brief

The partners asked for three things. First, the work had to lead, with large images and very little chrome around them. Second, a visitor needed to understand the process in under a minute. Third, the team wanted to update projects themselves without calling a developer every time a building was finished.

We started with a week of interviews. We spoke to the two partners, the office manager and four recent clients. The clients all said the same thing: they had found the studio through a friend, visited the site, and then emailed to ask questions the site should have answered. How long does a house take? What does a first meeting cost? Do you work outside the city?

What we heard from clients

People wanted proof before they wanted beauty. They wanted to see finished rooms, plans and real timelines. They also wanted a clear first step. A form that asked for a budget scared some of them away, so we kept the first step light: a short note and a phone number.

What we heard from the team

The team wanted control. Every project had a story, a set of photographs, a location and a year. They did not want to fight a page builder to add them. They wanted a form with fields, and a page that looked right when the fields were filled in.

Structure and content

We built the site around a projects collection. Each project has a title, a category, a year, a location, a cover image, a gallery and a long written story. The story is rich text, so the team can add headings, quotes and lists. The detail page reads that story and builds a contents list from the headings, which keeps long case studies easy to scan.

The index page

The index shows every project in a grid with a filter row above it. Visitors can pick houses, interiors or public work, and search by name or place. The count above the grid tells them how many projects match, and the pager keeps the page short on phones.

The detail page

Each detail page opens with a single full-width photograph, the title and a short fact row: year, place, size and status. Below it sits the story with its contents list on the side. At the end there is a simple call to action and links to two related projects.

Design system

The palette is almost entirely neutral. Warm white, a soft concrete grey and a deep ink colour carry the whole site. A single accent, a cold glacier blue, marks links and focus states. Type is a single grotesque family in three weights, set large for headings and generous for body text.

Grid and rhythm

We used a twelve column grid with wide outer margins. Images break the grid on purpose, running to the edge of the screen, while text stays in a narrow column for comfortable reading. Vertical spacing follows an eight point scale, so every section breathes the same way.

Motion

Motion is quiet. Images fade up a few pixels as they enter the screen. Page changes cross fade. Nothing bounces, spins or slides in from the side. Visitors who ask for reduced motion see no movement at all.

Build

The site is built in Framer with the CMS for projects and journal posts. We wrote a small set of components for the parts Framer did not cover: the filter row, the search box, the pager, the result count and the contents list. Everything else is native Framer, which means the team can change layouts without code.

Performance

Images are served at the right size for each screen. Fonts are loaded with swap so text appears at once. The home page weighs less than a megabyte on first load, and the largest image appears in under two seconds on a mid range phone.

Accessibility

Every interactive element can be reached with the keyboard. Focus rings are visible and use the accent colour. Images have written descriptions, and the contents list is a proper navigation landmark that screen readers announce.

Results

In the first three months after launch, enquiries rose by about forty percent. More importantly, the enquiries were better. People arrived knowing the process, the rough timeline and the kind of work the studio takes on. The office manager said the first call became a real conversation instead of a list of basic questions.

Time saved

The team now adds a finished project in about twenty minutes. They fill in the fields, upload photographs, write the story and press publish. No developer is involved, and the layout always holds.

What we would do next

The next step is a small journal for process notes and site visits, using the same collection pattern. We also want to test a map view of projects, since location matters to many visitors. Both can be added without changing the core of the site, which is the best sign that the structure is right.

Lessons

The biggest lesson was to listen to the people who use the site, not only the people who pay for it. The partners cared about beauty. The clients cared about answers. A good site gives both, and the answers come first. A clear structure, honest content and a few well made tools did more for this studio than any visual trick could.

Create a free website with Framer, the website builder loved by startups, designers and agencies.