The Design thinking process of my restaurant landing page.

Second week of my design journey in the wejapa internship, we have been learning design theories and it’s time to get into the practical phase. Got excited that i would finally be able to start designing and put my design thinking process into use, but it was much more challenging than thought, but yet fun.

We were given task to design a landing page for a friend’s restaurant using just typography. No vector illustrations is allowed with little or no image. This got much more challenging than i thought and starting was my biggest obstacle.

I started getting inspirations from pintrest, behance and dribble. I got overwhelmed and had this thought that i might not be able to do it.

I finally summoned courage to start because it was my first real-design. I started brainstorming and eventually came up with ideas. Brainstorming is a very critical part of the design process as you have to always have to empathize and have the users in mind. I started with choosing colors and after a series of research on color psychology, i settled with red-orange which is a color known to elicit hunger based on research.

I also built a small icon for the page which would represent the brand and serve as what the site stands for. The icon is in form of an house-like shape with a fork and knife in-between which represents the urge to eat.

Next up is the Hierarchy of the typography. The hierarchy was arranged with an end-goal of directing the users to order for a meal. The order button sits boldly at the center of the page.

For the typography style, Amita was used for the H1’s and H2’s. The reason i picked amita is due to it’s simplicity and classy nature. It is simple and yet catches the eyes. Roboto font was used for the paragraph texts and the lower headings as roboto is easy to read without straining the eyes making it bold to increase visibility.

I also tried to arrange the elements strictly following the principles of design, carefully arranging them symmetrically.

Elements are spaced evenly to avoid too little or too much negativ space. The buttons are designed with the minimalist view in mind.

Border radius was added to give it a more classy look and made the buttons big enough to be visible but not too big so attention would also be placed on other elements in based on their importance in the page.

Below is the picture of the full landing page in color scale


finally i also designed the grey-scale of the same landing page based on instructions given. This was actually more challenging as you cannot use the power of colors to place emphasis. But i did the best i could using different shades of grey-scale(monochromatic ism) with the darker hue placing more emphasis than the lighter hue.

grey scale

Design takes a lot of brainstorming, empathizing and prototyping before laying hands on the tools with the user in mind. My first design got more challenging than i thought and even after, i still feel that i haven’t done enough to do justice, but there is a saying which says you don’t have to be great to start but you have to start to be great.

This is just the beginning of my design journey and have no doubt that i would get better with time.

Criticism and suggestions are highly appreciated.

Thank you for starting this journey with me :)