Website   Logo  

The making of the Wall Street website templates

Overview   Process  

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.

fotooboi process 01

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.

fotooboi process 02

Starting to work on the design concept.

fotooboi process 03

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

fotooboi process 04

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.

fotooboi process 05

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

fotooboi process 06

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.

fotooboi process 07

Working on the custom mural configurator.

fotooboi process 08

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

fotooboi process 09

Creating technical graphics.

fotooboi process 10

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

fotooboi process 11

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.

fotooboi process 13

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.

Order a design...