---
title: Illustration
sidebar_position: 5
displayed_sidebar: null
sidebar_class_name: hidden 
---

import { ImageGrid } from "@site/src/components/mdx"

export const protocolPromotion = [
    {src: "/illustration/Conceptual-illustration-1.png", img: require("/illustration/Conceptual-illustration-1.png") },
    {src: "/illustration/Conceptual-illustration-2.png", img: require("/illustration/Conceptual-illustration-2.png") },
    {src: "/illustration/Conceptual-illustration-3.png", img: require("/illustration/Conceptual-illustration-3.png") },
    {src: "/illustration/Conceptual-illustration-4.png", img: require("/illustration/Conceptual-illustration-4.png") },
]

export const conceptualImages = [
    {src: "/illustration/Conceptual-illustration-5.png", img: require("/illustration/Conceptual-illustration-5.png") },
    {src: "/illustration/Conceptual-illustration-6.png", img: require("/illustration/Conceptual-illustration-6.png") },
    {src: "/illustration/Conceptual-illustration-7.png", img: require("/illustration/Conceptual-illustration-7.png") },
    {src: "/illustration/Conceptual-illustration-8.png", img: require("/illustration/Conceptual-illustration-8.png") },
    {src: "/illustration/Conceptual-illustration-9.png", img: require("/illustration/Conceptual-illustration-9.png") },
    {src: "/illustration/Conceptual-illustration-10.png", img: require("/illustration/Conceptual-illustration-10.png") },
    {src: "/illustration/Conceptual-illustration-11.png", img: require("/illustration/Conceptual-illustration-11.png") },
    {src: "/illustration/Conceptual-illustration-12.png", img: require("/illustration/Conceptual-illustration-12.png") },
    {src: "/illustration/Conceptual-illustration-13.png", img: require("/illustration/Conceptual-illustration-13.png") },
    {src: "/illustration/Conceptual-illustration-14.png", img: require("/illustration/Conceptual-illustration-14.png") },
    {src: "/illustration/Conceptual-illustration-15.png", img: require("/illustration/Conceptual-illustration-15.png") },
    {src: "/illustration/Conceptual-illustration-16.png", img: require("/illustration/Conceptual-illustration-16.png") },
    {src: "/illustration/Conceptual-illustration-17.png", img: require("/illustration/Conceptual-illustration-17.png") },
    {src: "/illustration/Conceptual-illustration-18.png", img: require("/illustration/Conceptual-illustration-18.png") },
    {src: "/illustration/Conceptual-illustration-19.png", img: require("/illustration/Conceptual-illustration-19.png") },
    {src: "/illustration/Conceptual-illustration-20.png", img: require("/illustration/Conceptual-illustration-20.png") },
    {src: "/illustration/Conceptual-illustration-21.png", img: require("/illustration/Conceptual-illustration-21.png") },
    {src: "/illustration/Conceptual-illustration-22.png", img: require("/illustration/Conceptual-illustration-22.png") },
    {src: "/illustration/Conceptual-illustration-23.png", img: require("/illustration/Conceptual-illustration-23.png") },
    {src: "/illustration/Conceptual-illustration-24.png", img: require("/illustration/Conceptual-illustration-24.png") },
    {src: "/illustration/Conceptual-illustration-25.png", img: require("/illustration/Conceptual-illustration-25.png") },
]

export const abstractImages = [
    {src: "/illustration/Abstract-1.png", img: require("/illustration/Abstract-1.png") },
    {src: "/illustration/Abstract-2.png", img: require("/illustration/Abstract-2.png") },
    {src: "/illustration/Abstract-3.png", img: require("/illustration/Abstract-3.png") },
    {src: "/illustration/Abstract-6.png", img: require("/illustration/Abstract-6.png") },
    {src: "/illustration/Abstract-7.png", img: require("/illustration/Abstract-7.png") },
    {src: "/illustration/Abstract-8.png", img: require("/illustration/Abstract-8.png") },
    {src: "/illustration/Abstract-9.png", img: require("/illustration/Abstract-9.png") },
    {src: "/illustration/Abstract-10.png", img: require("/illustration/Abstract-10.png") },
    {src: "/illustration/Abstract-11.png", img: require("/illustration/Abstract-11.png") },
    {src: "/illustration/Abstract-12.png", img: require("/illustration/Abstract-12.png") },
    {src: "/illustration/Abstract-13.png", img: require("/illustration/Abstract-13.png") },
    {src: "/illustration/Abstract-14.png", img: require("/illustration/Abstract-14.png") },
    {src: "/illustration/Abstract-15.png", img: require("/illustration/Abstract-15.png") },
    {src: "/illustration/Abstract-16.png", img: require("/illustration/Abstract-16.png") },
    {src: "/illustration/Abstract-17.png", img: require("/illustration/Abstract-17.png") },
    {src: "/illustration/Abstract-20.png", img: require("/illustration/Abstract-20.png") },
    {src: "/illustration/Abstract-21.png", img: require("/illustration/Abstract-21.png") },
    {src: "/illustration/Abstract-22.png", img: require("/illustration/Abstract-22.png") },
    {src: "/illustration/Abstract-23.png", img: require("/illustration/Abstract-23.png") },
    {src: "/illustration/Abstract-24.png", img: require("/illustration/Abstract-24.png") },
    {src: "/illustration/Abstract-25.png", img: require("/illustration/Abstract-25.png") },
    {src: "/illustration/Abstract-26.png", img: require("/illustration/Abstract-26.png") },
    {src: "/illustration/Abstract-27.png", img: require("/illustration/Abstract-27.png") },
    {src: "/illustration/Abstract-28.png", img: require("/illustration/Abstract-28.png") },
    {src: "/illustration/Abstract-29.png", img: require("/illustration/Abstract-29.png") },
    {src: "/illustration/Abstract-30.png", img: require("/illustration/Abstract-30.png") },
    {src: "/illustration/Abstract-31.png", img: require("/illustration/Abstract-31.png") },
    {src: "/illustration/Abstract-34.png", img: require("/illustration/Abstract-34.png") },
    {src: "/illustration/Abstract-35.png", img: require("/illustration/Abstract-35.png") },
    {src: "/illustration/Abstract-36.png", img: require("/illustration/Abstract-36.png") },
    {src: "/illustration/Abstract-37.png", img: require("/illustration/Abstract-37.png") },
    {src: "/illustration/Abstract-38.png", img: require("/illustration/Abstract-38.png") },
    {src: "/illustration/Abstract-39.png", img: require("/illustration/Abstract-39.png") },
    {src: "/illustration/Abstract-40.png", img: require("/illustration/Abstract-40.png") },
    {src: "/illustration/Abstract-41.png", img: require("/illustration/Abstract-41.png") },
    {src: "/illustration/Abstract-42.png", img: require("/illustration/Abstract-42.png") },
    {src: "/illustration/Abstract-42-1.png", img: require("/illustration/Abstract-42-1.png") },
    {src: "/illustration/Abstract-44.png", img: require("/illustration/Abstract-44.png") },
    {src: "/illustration/Abstract-45.png", img: require("/illustration/Abstract-45.png") },
    {src: "/illustration/Abstract-48.png", img: require("/illustration/Abstract-48.png") },
    {src: "/illustration/Abstract-49.png", img: require("/illustration/Abstract-49.png") },
]

These 3D rendered animations are used to promote Nomos, Waku, Nimbus, and Codex. Each Protocol has its own and can be used in static or animated form. In some cases these statues appear to be previously broken and repaired in the style of Japanese Kintsugi (golden repair). This is a metaphor for the vision of Logos to rebuild the currently broken modern society with the pieces of enlightenment and renaissance ideas.

Codex - data backbone, the archive, Atlas holding up the world

Nomos - David, ancient symbol of freedom and egalitarian values

Nimbus - Aphrodite with halo, lightness, symbol of love, attraction

Waku - Prometheus, delivering transformative technology

<ImageGrid mode="square-thumbnails" xs={{cols: 2, gap: "16px"}} md={{cols: 4, gap: "16px"}} images={protocolPromotion} />

## Conceptual

The selected illustration style is detailed, and symmetrical to suggest the subliminal or occult. The artwork can be simplified but should be strong conceptually relating back to one of the concepts.

Need to come up with a plan/process for creating/buying/commissioning/using this type of illustration. Could be applicable to Network State Press articles and social promo stuff.

<ImageGrid mode="square-thumbnails" xs={{cols: 2, gap: "16px"}} md={{cols: 4, gap: "16px"}} images={conceptualImages} />

## Abstract

Texture can be preferable giving a layering or aging effect to the work suggesting time or craft. Many digital illustrations can feel rushed or flat without a subtle texture effect depending upon the execution.

HIO uses these abstracts for the Flash Hash episode covers.

<ImageGrid mode="square-thumbnails" xs={{cols: 4, gap: "16px"}} md={{cols: 7, gap: "16px"}} images={abstractImages} />