Designing an Identical Experience Across Devices: Product Catalog

Materium online catalog’s case study

Recently I’ve been talking to a lot of people — either potential clients or even employers — about my work. They are usually curious about my process from understanding the brief to making decision on design, experience, and technical stuff. One of the most talked about project is materiumideas.com, so I think it’s worth to share the process on Medium.

Materium is a furniture brand that aims to bring about the change of how we live, work and do things in between. The brand was designed in collaboration with Thinking*Room (where I worked) in 2019. Just few weeks before their launch event, Materium’s team decided not to let the domain they will mainly use for email shows a blank page. That means we had less than a month to make a landing page for materiumideas.com.

Materium’s identity designed by Thinking*Room

We started by deciding what the landing page should be. At the time, Materium didn’t have its own store yet and they would only showcase their product on selected showrooms. Other than that, people can learn about it from @materiumideas instagram but the information there is very limited. We believed it was necessary for the brand to have something where people can look up to learn more about the products.

We looked at what we had back then at Thinking*Room. The team were still working on editorial photo shoot and product fact sheet design, so we decided in parallel with that we can compile it to make an online catalog.

With limited time in mind, I thought making an identical experience on desktop, tablet, and mobile can save a lot of time on the development process. I had seen growing numbers of Indonesian websites like Sorabel and Kitabisa doing the same, so the challenge was to explore and push the boundaries of what identical experience across devices could be.

Understanding the Limit

When we want to design something that works on multiple devices, we have to understand limitations each device has. Know what features are available on every device—or at least…