Context

This was a relatively small freelance project. The client is a renovation expert with more than 15 years of experience, looking to have some online presence. Namely, he often had requests to send over his pice-list. In Ukraine, where he lives, and where people of his profession are rarely at ease with technology, here’s how it usually goes in such cases:

• People either write their price-list down on a piece of paper and send a photo (or photos) of it to a potential client.
• Alternatively, they have a note in a notes app and send a screenshot each time. As the list was usually long, there were either multiple screenshots or one long screenshot which you had to zoom in to.

The client was wondering if it was possible to make it work more elegantly. He also mentioned that some prospects ask him to send photos of his work, so he’d like to make those photos easily available too. We looked online if there were any platforms for this type of work, but there were none for his city.

So, the need was to present his prices and photos. With a proper, appealing homepage, a website could be quite a fitting solution.

At the time, I was looking to explore the Neumorphism design trend. It had quickly earned itself a controversial reputation because of many daring design concepts floating around of Dribble but I believed that, if applied correctly on a product with right information density, it could totally work both visually and functionally.

In addition, I was looking to learn certain new technologies, namely Eleventy and Airtable, and this project was perfect for me to try my hand at those.

The process

I started exploring some design ideas, and after understanding how Neumorphism worked, both in design tools and in CSS, I got to work. I took the mobile-first approach, not only because it was generally considered to be a good “default choice” for numerous reasons, but also because I knew that in Ukraine, many people used smartphones as their primary “internet communicator”.

Information architecture

The client gave me some key facts about him and his job (like types of jobs he does most often and his crew he invites for larger projects). He had very little idea of how he would organise the information, so I more or less had a carte blanche in this regard.

The three key types of information to show were:

• Services (and their prices)
• Photos of his work
• Testimonials (I convinced my client the entire thing would be much more credible if backed up by reviews from his past clients)

Those three things would be the 3 main sections of the future website. And then I’d throw a Home page to the mix, with some key information about the client followed by some snippets from each section.

Draft phase