Case Study

Kitch - Hospital Kitchen

Brief

Kitch is a food delivery platform focused on hospitalized patients. Taking in consideration the low satisfaction on hospital food's surveys, Kitch comes to bring a health, varied, and personalized service for patients who need specific recovery needs.

Brand

Shape

Kitch's logo is composed of two basic elements, colour and shape. The shapes are presented by the letters of a typeface. The one chosen in this case was a display (or decorative), handwrite typeface. That typeface style can convey a personalized feel, what matches perfectly with the idea of the service provided. The irregular alignment of the typeface also makes it look casual and approachable. At the same time the tight kern (space between letters), and large difference between the x-height (height for the lower-case letters) and cap height (height of the upper-case letters), give a modern and elegant touch to the logo.

Colour

In terms of colour the logo endorses the elegant personality. A vibrant purple background contrasting with a golden dark yellow conveys a great selective feel. The colour purple is most commonly associated with sophistication and luxury. It can also mean mystery and creativity. Within the theme in question it is up to the product owners to decide how affordable the service will be, what targeted audience they want to appeal to. The golden yellow also adds up to the same look and feel. Yellow works very well with purple since they are complementary colours (colours positioned in opposite spots on the color wheel), however the hue chosen for the yellow has a very dull look, almost faded what can suggest an introspect and more reserved personality.

Website

Shape

In terms of shape the website does a very good job pairing the serif typeface EB Garamond with the san-serif geometric Hind. However, the typeface used for the form and button, Poppins, is too similar to Hind, making it not a very good option to that pairing. It would be probably best to use Hind for both situations. For the other elements in the page, the shape is very consistent with sharped edges and clean, thin lines.

Colour

Regarding to colour, once again the purple and yellow apear in the same situation as in the logo. Now, however, there is a third colour creating an excellent focus point on the page: white. The picture was very well chosen since a also complementary colour to purple prevails, green.

Space

The space is very well used, and once again endorses the elegant feel of the page. The space is clean enough so the elements don't fight with the heavy colour of the background. Once you click on Learn More, the page gets lighter to be able to carry more information without making the user's eye tired with so much visual stimulus.

Movement

The page makes use of movement in more than one situation. After clicking More Information, the page smoothly slides to the left making space for the content appearing from the right, the same happens, but to the opposite direction when hitting Close. But, instead of all the page slides, the left half of the page, where a picture is located, moves in a different way, zooming out, and then zooming in after closing the More Information tab. Those two different movements happening at the same time to accomplish the same task breaks the consistency of the movement and consequently the softness of the slide. It also divides the background in two parts, instead of keeping it as a whole single page as it should.

Besides the movements on the screens change, the picture on the page also has some movement going on. The picture follows the movements of the cursor on the screen, controlled by the user. The problem is that there is no reason for that kind of animation. It goes against the feel the page conveys with all the other elements in it. The movement is also too short and can make some users confuse it with some sort of page bug.

Conclusion

The page is very well structured, with a clear personality and great legibility. Although there are some inconsistencies and unnecessary features, those don't compromise the look and feel of the page in a high level.

** This article was written as a personal exercise conducted by a UI design student and can't be considered as a real review of the work in question.**