The making of the Wall Street website templates

When we started, the company was called fotooboi21, the website was a typical template-generated online store and the gluing instructions were complex and confusing.

Visiting the production house, looking at the materials and the murals, understanding the subtleties of color reproduction and gluing.

Studying the competitor websites in Russia and in the world. It’s a virgin land. Everybody seems to be living in the world of cookie-cutter online stores with no regard for specific features of the business. The only way for customers to ask a question is over the phone, and customers tend to have a lot of questions.

There are two ways to purchase a mural. The main one is to have it made to order. The customer has to choose one of thousands of pictures on the website, decide on the size of the future mural (which does not really depend on the size of the picture—company designers will fill in the missing fragments if necessary) and choose one of twenty available materials. They can also order color grading and are advised to perform color proofing. The price depends on all the chosen parameters. The second option is to buy ready-made murals. Everything’s easy here: choose your picture, material, size, price. You just need to find what you want.

Outlining the main functional parts of the website and working on use cases.

Starting to work on the design concept.

We have functional ideas, but what we need is a recognizable image. Starting the search.

Choosing minimalism.

The picture will stretch across the whole screen regardless of the browser window size. The website shows an interior of a room with the mural. Supplementing the search bar with category navigation, creating an approximation of the main page and showing to the client.

The client likes the result. Starting to work on key screens based on the site map and launching the development process.

We joke about Twin Peaks and the red room on the 404 error page, but later give up the joke in favor of a light and clear design with a peculiar feature.

Working on the custom mural configurator.

Making the navigation header more informative. Tiles representing design stages now show the chosen parameters.

Creating technical graphics.

Holding a photo shoot of furniture, catching the cat, assembling interior compositions.

Placing the furniture around the website using PNG masks and canvas to optimize loading times.

Working on animations and transitions.

The client brings over the tools for gluing. Holding another photo shoot, retouching pictures, rewriting the texts and the script, typesetting.

Polishing animations and transitions, debugging and optimizing.

Supervising implementation of the templates by the client, testing, debugging, editing. Coming up with a new name and a logo for the company. Animating the logo and launching the website.