---
title: etosis
images: ['work/etosis/etosis_og_ogqfae', 'https://res.cloudinary.com/dkvjosg5p/video/upload/v1696948648/work/etosis/etosis_mail_wawrua.webm', 'work/etosis/scrnli_Oct_10_2023_3_._xkz9er', 'work/etosis/scrnli_Oct_10_2023_2_._lxh0xh' ]
description: Simple housestyle and website for a software company specialised in complexity
referenceName: Patrick Simpson
reference: https://www.linkedin.com/in/patricksimpson/
tags: ['Housestyle', 'Graphic Design', 'Web Development', 'Animation']
svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1136.37 547.52"><path style="fill: currentColor" d="M412.35 274.93c.19 3.41.19 6.84 0 10.25H270.51c1.9 26.58 27.34 51.18 60.29 51.18a67.587 67.587 0 0 0 52.7-25.82l20.12 20.88a97.618 97.618 0 0 1-72.82 34.47c-49.3.89-90.04-38.25-91.12-87.55v-4.56c0-51.18 34.93-92.18 87.63-92.18 48.98 0 85.35 36.83 85.35 93.32m-31.13-16.33c-2.78-27.6-26.49-48.32-54.22-47.38-28.03-.97-52.18 19.56-55.73 47.38h109.95ZM421.84 186.16h34.17v-53.15h31.89v53.15h54.67v28.55H487.9v94.69c0 17.08 8.35 26.96 25.44 26.96a42.01 42.01 0 0 0 20.12-7.59l11.77 26.2c-11 6.7-23.57 10.37-36.45 10.63-25.06 0-53.15-16.33-53.15-55.05v-95.83h-34.17l.38-28.55ZM736.66 273.79c1.11 49.86-38.41 91.18-88.27 92.3s-91.18-38.41-92.3-88.27v-4.02c-1.13-49.86 38.37-91.2 88.23-92.33 49.86-1.13 91.2 38.37 92.33 88.23v4.1m-31.89 0c0-34.55-23.16-62.57-58.39-62.57s-58.39 28.1-58.39 62.57 22.78 62.57 58.39 62.57 58.39-28.1 58.39-62.57M772.35 308.64a67.313 67.313 0 0 0 53.15 28.47c17.84 0 37.97-7.59 37.97-21.64 0-15.19-12.91-22.78-39.79-28.1-37.97-7.59-64.09-22.32-64.09-55.35 0-25.44 25.36-50.42 64.47-50.42a91.14 91.14 0 0 1 64.85 26.58l-21.03 21.72a64.366 64.366 0 0 0-43.96-19.29c-22.78 0-33.41 10.93-33.41 22.32 0 13.29 13.67 20.5 42.45 26.58 33.41 7.21 61.81 19.74 61.81 55.43 0 33.71-35.69 51.18-69.4 51.18a95.993 95.993 0 0 1-75.1-36.83l22.1-20.65ZM944.56 108.41c11.95 0 21.64 9.69 21.64 21.64s-9.69 21.64-21.64 21.64c-11.95 0-21.64-9.69-21.64-21.64 0-11.95 9.69-21.64 21.64-21.64m-15.87 77.75h31.89v175.25h-31.89V186.16ZM1013.89 308.64a67.569 67.569 0 0 0 53.15 28.47c17.77 0 37.97-7.59 37.97-21.64 0-15.19-12.91-22.78-39.79-28.1-37.97-7.59-64.09-22.32-64.09-55.35 0-25.44 25.36-50.42 64.47-50.42a91.14 91.14 0 0 1 64.85 26.58l-20.96 21.72a64.583 64.583 0 0 0-43.96-19.29c-22.4 0-33.41 10.93-33.41 22.32 0 13.29 13.67 20.5 42.45 26.58 33.41 7.21 61.81 19.74 61.81 55.43 0 33.71-35.69 51.18-69.4 51.18a95.993 95.993 0 0 1-75.1-36.83l22.02-20.65ZM0 142.65l90.11 59.43-62.71 40.93-.11.09c-4.22 3.38-7.72 7.13-10.41 11.17-10.73 16.86-6.06 38.93 10.59 50.29l63.27 40.21L0 404.19V142.65Z"/><path style="fill: currentColor" d="m68.58 314.96-32.87-21.68c-4.98-3.11-8.65-8.65-9.9-14.86-1.29-6.43.08-13.12 3.65-17.89 1.9-2.54 3.8-4.44 6.32-6.34l66.8-44.31 44.44 28.95c4.92 3.53 8.65 7.47 11.73 12.4 12.08 18.44 6.8 44.18-11.73 57.46l-44.43 28.95-34.01-22.67ZM0 420.44l102.58-67.94 44.44 28.95c4.92 3.52 8.65 7.46 11.73 12.4 12.09 19.1 6.83 44.86-11.73 57.45L0 547.52V420.44ZM0 127.07V0l147.02 96.21c4.55 3.26 8.51 7.21 11.77 11.75 5.83 9.77 7.8 20.33 5.85 31.39-1.88 10.68-8.12 19.9-17.54 25.96l-44.52 29L0 127.07Z"/></svg>'
---
Etosis is a small software consultancy and development company based in Helsinki, Finland that specialises in solving extremely complex software challenges.

## Visual Identity

The concept of a graphical representation of complexity was the starting point for the logo, which approximately represents the letter 'E' for etosis.

Both the logo and the illustrations are drawing inspiration from wavelength graphs, since a lot of the company's products are measuring and then processing such data. 

## Website

When it came to designing the website, the issue was that the products of etosis mostly aren't customer facing, meaning they have abstract interfaces and applications. Therefore we had no real imagery to use, and we wanted to refrain from using overly generic photos also. 

So I developed simplistic vector-based animations for each product that make the site interactive and interesting, even though the subject matter is rather dry.

The website was built in [Eleventy](https://www.11ty.dev/), a static site generator. The animations were created as SVGs and then animated with Javascript.

<a class="button" href="https://etosis.com">Live Site</a>