Exploring the subject area and realizing that many companies use trivial investment metaphors in their promotional materials.
Deciding to develop a concept in which the client simply won’t need to add photographs to the website. It has to be a self-sufficient style that would be stable enough without the use of photos. We get the idea to create patterns based on repeating color lines. The lines resemble graphs, patterns on banknotes and stock certificates and perfectly rhyme with the company’s logo.
Changing the shape and color of lines allows to easily extend the pattern to support any number of products.
The same concept can also be applied to stock charts.
Additionally, the patterns create interesting effects when they overlap.
Creating a nice hover effect for the product button.
Drawing main pages of the concept.
Presenting the concept as a prototype and supporting it with a video that provides additional information about the style.
The client approves the concept. Starting detailed drawing and choosing pattern colors.
Taking simple patterns with alternating lines as a basis. Lines are of the same thickness as gaps between them.
Adding a perspective to create patterns.
Applying the perspective to complex lines and looking at the patterns play. Overlapping with no perspective (on the right) does not generate the same effect.
Curved lines look even more interesting.
Drawing curves for all products and creating derivative patterns. Adding primary colors as well as additional ones for the hover effect.
Trying to make sure the patterns reflect the nature of the products, simplifying if necessary.
Starting to work on the website’s internal pages. We want to come up with an exciting effect that would make visitors play with it. Maybe reveal the header in some interesting way?
We get the idea to hide the header behind a blinds-like effect. Using guilloches for inspiration. Taking the idea to the technologist and putting together a prototype in 10 minutes.
The result looks cool. Deciding to hide application and contact forms in the same way.
Starting to typeset the rest of the pages. Typeset in Mirta typeface, the text block resembles a page of a printed edition, begging for some sort of a classic feature. Adding a dropped capital. Typesetting the lead in two columns to make the layout more interesting.
Starting to work on comments. We need to make sure the page is interesting to read and look at. Deciding to go with a dark background. The color of the header on this page matches the color of the background, so we won’t be hiding it. But we still want to add something interesting. Adding a pattern-inspired shadow to the dropped capital.
The application button comes out to be large, round and beautiful. Changing the application form to match.
Adjusting the search results page to be in line with other pages.
Making a bold decision to show large currency symbols on the bank details page. The symbols gleam when the page is scrolled, definitely worth having a look!
Drawing a strict 404 error page.
Adding central alignment on error pages to make sure they match the rest of the website.
Adjusting pattern colors.
Changing the mechanics of the main page.
Fixing bugs and launching the website.
