Oh! Hi there, I'm Jono.
I’m a product designer that loves diving into code, thinking through systems, and obsessing over details. More about me.
Work
-
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #135762; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #4A127B; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #4A127B; :after { background: #135762; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #135762; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #4A127B; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #4A127B; :after { background: #135762; } } Wanderium
Founder2018 - 2020 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #e0361f; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #b19128; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #b19128; :after { background: #e0361f; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #e0361f; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #b19128; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #b19128; :after { background: #e0361f; } } Wanderprep
Side Project2017 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #222; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #444; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #444; :after { background: #222; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #222; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #444; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #444; :after { background: #222; } } Deveaux New York
Freelance2017 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #1662ec; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #104fc1; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #104fc1; :after { background: #1662ec; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #1662ec; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #104fc1; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #104fc1; :after { background: #1662ec; } } Remembered.io
Side Project2015 - 2017 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #2e9fff; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #1f78c3; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #1f78c3; :after { background: #2e9fff; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #2e9fff; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #1f78c3; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #1f78c3; :after { background: #2e9fff; } } Disqus
Lead Product Designer2012 - 2016 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #2e838e; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #a2281e; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #a2281e; :after { background: #2e838e; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #2e838e; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #a2281e; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #a2281e; :after { background: #2e838e; } } UX Scotland
SpeakerJune 2015 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #666; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #136f80; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #136f80; :after { background: #666; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #666; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #136f80; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #136f80; :after { background: #666; } } TwoSides
Co-Founder2012 → -
:doodle { @grid: 4x8; @size: 100%; } overflow: hidden; background: #3a0099; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #6b5b00; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #6b5b00; :after { background: #3a0099; } } :doodle { @grid: 3x9; @size: 100%; } overflow: hidden; background: #3a0099; :after { content: ''; position: absolute; @size: 100%; border-radius: 50%; background: #6b5b00; transform: translate(@p( (0, 50%), (50%, 0), (0, -50%), (-50%, 0) )); } @random(.15) { background: #6b5b00; :after { background: #3a0099; } } Harmonizr
Co-Founder2011 →