M
D
Y24
T
↑  TOP  ↑
00-0
00-1
00-2
00-3
00-4
00-5
[ Close ]
× CLient
Aristide
× Project
Portfolio design
× Context
× JW.S
× Completed
2021
× Category
Interactive
× Responsibilities
art direction / web design / motion design
× Posted
2.10.2021
× Last Updated
3.9.2024
Index
Projects
Aristide
A High-level look of collaborative works.
Sound.XYZ
Developing a dynamic brand to help launch an innovative web3 music platform.
Scab Shop
Helping CTHDRL to brand a tattoo NFT project: Scab Shop.
Hangyaku V1
A deck of premium playing cards from combining an AI’s take on Japanese Ukiyo-e style art with modern design.
Ledger MP
Developing a branding concept for launching Ledgers new NFT marketplace.
RTFKT
I'm not yet able to discuss the scope of this project.
Arcteryx
Re-introducing a newer product category with more impact, and flagship products.
ISOKO
Expanding the brand's AD through interactive design + dev to launch a new lifestyle brand, ISOKO. More soon info soon.
Evinetta
Creating a poster series to accompany Ash Thorp and Carlos Pecino's new build + film, Evinetta.
Fila
Evolving the Fila brand while consolidating their fragmented global image via a flexible toolkit.
Basic
A broad collection of internal projects that I worked on for BASIC as an employee
JW.S
Using my own brand as an opportunity to highlight JW.S abilities as an end-to-end brand partner.
NØ–ISØ
Elevating, and hopefully inspiring creative authenticity.
Hello World
Creating some initial editorial layouts for a small film's pitch book.
Tavarua
A partnership in its infancy. Helping bring a small heart shaped island to the world.
Singer
Reusing a scrapped passion project for something productive (a 100% unofficial concept site).
DANC
A joint venture with long-time friend and shaper Dan Cobley to evolve and grow his business.
Apple
Developing art directions, and over-seeing production on sites to introduce new products/ services on dot com.
Google (23)
Developing the design direction for a future-vision project that had an emphasis on data organization and visualization.
GStore
Working as an embedded Design Director, I oversaw a team which was helping reinvent Google's global eComm experience.
Hatom
Developing various brand directions. More to come.. maybe?
Ramp
Working with Ramp to backfill various interactive design needs.
Netflix
Working with the Emerging Creative team to develop forward-thinking business solutions.
Aristide
× JW.S
2021
Preface
Aristide
Aristide
× JW.S
2021
Preface
Aristide

This is certainly one of the more fun collaborations I've had the chance to work on. The man, the myth, the legend that is Aristide Benoist asked if I'd want to design the next iteration of his site... and that was a quick yes. Going into it, he had ideas around an interaction model and type preferences... otherwise it was wide-open. And well... when working with someone like him, that wide-open can lend itself to almost endless possibilities– there's few (if any) people out there who can pull of what he can.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

gfdsgdsf

Working in a very iterative and collaborative manor, we navigated a lot of wild concepts while being grounded in a 60fps reality. Being the folio of developer who prides himself equally on creativity and efficiency, this had to walk a lot of lines. There were a lot more cool ideas we explored that ultimately got cut for performance issues to retain the 60fps bench mark, or to bob and weave around the nuances of WebGL loading jank. Super fun project though, and won Awwwards SOTM which made Mr. Benoist a happy man. Job done.

Inspo + Intro
Inspo + Intro
Inspo + Intro
Inspo + Intro
Output
Output
Output

Channeling Interactive / Editorial Vibes

I feel like everyone goes for the editorial vibes on interactive projects these days. My take is that designers go that way primarily out of spite for the limiting development tools that curtailed creativity as the internet made sense of a post-flash existence... but thats besides the point. Anyways, thats exactly what I went for her. Ari already had the font in mind, Timmonds, which is a product of one of my favorite editorial/graphic designers in Mr. Matt Wiley. If I was ever going to have a chance to make that man proud, it would be by using his font as somewhat as intended? As much as the focus of this project would be on the interactive model, I wanted to give editorial components a college try. Biggest type I could swing, some organic spacing (that ended up primarily existing in the motion system), a bunch of colors... that sorta stuff.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

[ inspiration not currently available ]
Output
Output
Output
Output
Output
Output
Output

Balancing Editorial and the (hyper-) interactive

To say I took an iterative process on this is an understatement. While the font and the concept for the core interactive model was coming from Ari, there was still a TON of room to play in working with someone like him. Ari didn't have any branding to carry over, he didn't have a solution in mind of how to navigate around projects, how much content we show/when, how do we make it expressive, etc etc. This really left a lot of space for me to navigate and push out the edges a bit.

On top of the aforementioned explorations, Ari and I had done tons of back and forth on the best way to do things functionally. He/I/we'd have an idea of how to do something like a grid view (that we both very much liked), but after either testing out the concept (or him immediately flagging concerns), we'd have to pivot off to something else. Everything ultimately had to meet his standards– 60 FPS, and no jank. Never jank. I've come to learn from Ari, through a lot of him patiently reiterating it, that there's a lot of nuance in the how/when things can/cannot be loaded with WebGL. In spite of all of it's glory, WebGL can be very... particular. (Shout out to him being patient and putting up with my ignorance, and constantly schooling me.) Seeing as this was his site (a developer who prides himself on balancing expressiveness and efficiency), it needs to embody his values, and his concerns would obviously supersede mine. There were many intersections of visual design and interactive models where we needed to compromise on something that operated well and prioritized performance, but ultimately I'm super proud of how this one turned out.

[ Desc. ]
Load-in transition for the project detail pages.
[ Desc. ]
Final design of the about page. I wanted to push this a bit more, but landed here due to responsive issues and Ari's push for simplicity.
[ Desc. ]
Breaking down the construction of how his many awards are displayed. Not the most scaleable, but more unique.
[ Desc. ]
A look at some of the Sketch component used on Ari's 2021 folio
[ Desc. ]
A concept for teaser for the new site Ari and I were launching.
[ Desc. ]
I always liked the ridiculousness of the AT3-21 logo.. so I mapped it to a book for fun.
Process
Process
Process
Process
Process
Process
Process
Process
Additional Scraps
Additional Scraps
Additional Scraps
Additional Scraps
Additional Scraps
Additional Scraps
Additional Scraps
Additional Scraps

Exploration on Exploration

Being an iterative designer by nature, and now having one of the best developers in the world as a collaborator, I iterated a looot on this one. It's one of those perfect storms where it was almost hard to know when to stop.. I could keep chasing more and more ideas into crazier areas. We eventually had a moment where we just agreed we needed to make decisions and stop iterating and actually finish something. Whoops™

¯\_(ツ)_/¯
[ Nothing here...yet ]
/00-1
Our creative world is both thriving and suffocating under its own weight and control mechanisms.
[ B → 001 // 003]
Observations

At the moment, the creative world feels like it is simultaneously thriving and suffering under it’s own weight. With the advent of various creative platforms and social networks, we:

×
Gained access to near-infinite exposure and opportunity.
×
Can experience real-time creativity.
×
Gained access to those who create the work that inspires us most.
×
Can access the entire history of art (and the world) with a few keystrokes.
×
Can create and share things that exist on a more-level playing-field than ever.

As an unintended consequence of this level playing-field, potentially inspiring work regularly gets lost in the drone of our perpetual creation. To help elevate quality content, social platforms ingrained algorithms as an attempt to dictate substance. It’s a nice idea, but creativity is not binary. With the obvious limitations in algorithmic curation, there are plenty of people trying to make sense of it all through a variety of lenses, and motivations.

Understanding that navigating these filtration systems is a path to creative validation, people have begun focusing on the destination, not the journey. This shift has come with a sharp increase in blind trend-chasing and a general lack of authenticity in creative work. Many people feel an obligation to fall inline with current trends for fear of failure or rejection, even if it’s not where their passions lie. Instead of utilizing these amazing tools for personal growth, they feel pressured by them into conformity.

( B → 002 // 003)
AssertIONS
(01) Continual Growth

I believe that creativity lacks a destination and exists as a continual progression; there’s never a finish-line, and everything can always be better. If someone operates under the assumption that they have all the answers, they are doing themselves a great disservice by stunting their own creative growth. To that point, it’s important to continually broaden our horizons to gain a more thoughtful understand of the world around us– taking in the good with the bad. If we look for inspiration in familiar places, we’re bound to miss opportunities to innovate and progress– it can be hard to see beyond what’s already been done to find new or refined perspectives, techniques, or styles. I’ve also found it valuable to routinely challenge my interests and value systems to either validate or refute what I had held to be true. It’s a humbling, yet enlightening process, that others might find useful as well.

(02) A REalm of Unknown

The realm of creativity is inherently devoid of absolutes. It’s fluid, and malleable to exist as whatever is most meaningful to you. It’s also confound with the unknown, and thats where it’s beauty lies. Nobody has a definitive answer for anything– no matter how loud they yell, or how big a stage they stand upon– it’s almost all entirely subjective at the end of the day.  While I do have a lot of combined experience and exposure to what's out there, I'm still learning, growing and getting inspired all the same... so I don't pretend to be the ones who actually has answers.

(03) The Objectives

Basically, this is what I hope to do:

×
Be a source of unexpected inspiration
×
Broaden people’s creative horizons.
×
Champion creative individuality.
×
Subvert group-think/trend-chasing.
×
Breakdown the barriers between specializations.
×
Establish a network for collaboration across creative disciplines. (possible phase 2)

I'm planning to share work that I find interesting, insightful, or provocative in the hopes of catalyzing creative growth in myself and others. Everything is meant to be taken at face-value where it’s merit is determined by each individual. I'm offering context here, not answers.

( B → 003// 003)
Synopsis
[ 01 — This isn't original ]

I'm not pretending to be the first to have these thoughts– some of them are pretty widely-held beliefs. As common as the sentiments might be, they aren't typically vocalized or actualized since critical (or even alternative) perspectives can be demonized and written-off as counter-productive... and that's just dumb. I understand that I skew to the contrarian side of the spectrum at times (partially why I feel the name is so fitting), but I do so with the goal to positively influence the creative community. I'm not anti-anything, I'm (cogently) finding my way like everyone else and trying to do my part to elevate the creative baseline. A rising tide lifts all boats.

[ 02 — THis isn't for everyone ]

I know that this can’t be all things to everyone. It’s something great to achieve in theory, but attempting to do so invariably convolutes and undercuts any purpose that isn’t explicitly to please others. I have my own values that guide me (and subsequently this channel), and I want to place those at the forefront; even when they don’t resonate with others for any number of reasons. I also understand that this will be prone to personal biases in taste–which tend to be darker, progressive and more provocative– and that might not be appealing to everyone either.

[ 03 — everyone is welcome ]

While it might not made for everyone, I definitely want to welcome everyone. Especially those with alternative perspectives to encourage constructive dialog around those differences– we need more of that now than ever it seems. You also don’t have to be a creator by profession for this to provide some value. Everyone is inherently creative in some capacity, and I hope to inspire and involve those individuals all the same.

[ 04 — This is Automatic for me ]

Part of the reason I wanted to do this, was that I was already doing all of this on my own, but purely for my own benefit. When I design I collect inspiration on Pinterest. When I browse Instagram, I like and collect images that I find inspiring. When I listen to music, I make playlists. I felt these action were very helpful for me on my creative journey, and with a little extra work, I could formalize it for others' benefit as well.

/00-2
Collecting and elevating uniquely creative work to encourage further authenticity and collaboration.
( C → 001 // 002 :: Visual)
A general representation of the aesthetic, sampled from random pins in the pinterest board.
( C → 001 // 002)
Visual
INSPIRATION
(01) Inspiring individualistic growth.

The goal is to provide a source of unexpected visual inspiration by curating/collecting work that is uniquely creative. I believe meaningful inspiration comes from increased exposure to alternate perspectives, mediums, styles, etc, and I'm seeking out those disparate sources where the only predictable through-line is in their quality and authenticity. Everyone is inspired by others, who we ultimately use to forge our own creative voice/perspective/style/etc, and the more informed we are, the stronger our foundation to build upon.

(02) the how

This curation is going to be done on all the visual social channels that I currently use, and that allow for any sort of curation– Pinterest and Instagram. After a lot of internal back-and-forth, I've opted to all curate each channel as I experience them. While I think it would be nice to uniformly increase exposure by cross-pollenating content across the channels, it undercuts the purpose of each's existence. What good is both a Pinterest and Instagram presence if all the content is the same? Each platform also has it's own hierarchy of content, and I'd like for each live within that vs trying to strong-arm it into something else.

(03) the Aesthetic

As much as I like to bring in varying types of creative work, there undoubtedly will be an aesthetic through-line. I have my own biases that I try to downplay by including so many different kinds of work, but it will show. At a high-level, some of the common characteristics/themes I would expect to see through the work:

×
Emotive
×
Honest
×
Thoughtful
×
Bold
×
Progressive
×
Edgy
×
Relatable
( B → 002 // 002 :: Auditory)
A collection of playlist covers used to additionally promote artists. started as composites, now features artists work.
(C → 002 // 002)
Auditory
MUSE

For me, music and my creativity go hand-in-hand. I’m almost always listening to music in general, and it's 100% of the time when I'm working. I find it to be a muse that adapts with me and the type of thing I'm working on in the moment. When I want to get after it, I can put something up-tempo on, or if I'm doing more ideating I can shift to something more mellow/ambient, and so on.

Just as I’ve come to appreciate all forms of design, I’ve also come to appreciate nearly all forms music. More recently, I had found myself with narrowing musical interests partially thanks to algorithmic curation on platforms like Spotify, and partially because I didn't know where to look any more. The extent of streaming platforms' catalog can be overwhelming, and unless you spend time at it, you're left with their playlists that tend to be very narrow in focus– either in genre or in a 'mood'. I want this playlist to be a curated jumping-off point for others to discover different types of music they wouldn’t otherwise been exposed to. Hip-hop, acoustic, oldies, classical, techno, motown– it’s all there to open new doors for people to get lost in.

I'm looking at the playlist through the same lens as the visual curation– if it feels creatively authentic, and/or interesting, it has a place in the playlist regardless of genre. I undoubtedly have genres I know better or just favor over others, but I try to keep those biases in check and make it a priority to embrace things I don't typically listen to, but do enjoy. I've never thought of this playlist as something for continuous listening since the range spans most genres and moods, and I realize that lack of continuity might be off-putting. Maybe the playlist isn't for you, and that's all good.

/00-3
An ambitious unifying of creatives to collaborate across disciplines, primarily on passion projects.
( D → 001 // 001)
Broader
ambitions
(01) Communication

We enable communication between disciplines with the intent to minimize the barriers dividing creative niches. Many creative fields are siloed where casual communication across specializations isn’t encouraged, enabled, or ever really needed. This would be far from the first effort to try this, but I believe the cross-pollination of ideas is a core value to more enlightened creativity. Knowledge-sharing is a self-less act: a value that any successful collective is predicated upon.

(02) Mentor Creatives

We have a home for up-coming creatives to further develop their perspectives by conversing with people who have already worked hard to define their own. Not in search of answers, but for information to better understand the world around them. One’s exposure and experiences play a huge role in refining their own creative voice, and I want to enable those who already show great promise, and help them actualize their potential.

(03) sharing Insights

We make a concerted effort to share insights from our own creative experiences, and those we look to for inspiration. This is done explicitly through articles + interviews, and implicitly through the work we choose to feature. This is purely an act of knowledge sharing with the hopes of exposing people to more ideas we believe in. We will never mandate or use the word ‘should’– deductions are the responsibility of the individual. This is not thought-leadership, because you are your own leader.

(04) Lets make cool things

We have ambitious ideas, but may not have possessed the means or understanding to properly realize them on our own. Collaboration can take many forms: kicking around ideas, getting meaningful feedback, or working together to create something. I'd love to prioritize creation in this effort, but I want people to utilize this network for whichever means they find most useful– there’s no expectation with admission. Within these bounds, I hope that bigger + broader ideas can become realities (both directly and indirectly)

(05) Wanna make this work?

If this strikes a chord with you, I'd love to chat. I still very strongly believe in collaboration and a network of creatives for passion projects, I just need some help getting it off the ground as I'm a bit swamped with other pressing things at the moment (ie. getting independent studio hummin along)

LETS ChAT →
Project Meta
Project Meta
Project Meta
Project Meta
Project Meta
Project Meta
Project Meta
Project Meta
Attribution +
Add'l Info
Recognition
Awwwards SOTM
Awwwards SOTD
FWA SOTD

Credits

Design

Jon Way

Development
Aristide Benoist ↗

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Subscript

× Title
Aristide
× Project
Portfolio design
× Context
× JW.S
× Responsibilities
art direction / web design / motion design
× Project Type
Interactive
× Tags

This is certainly one of the more fun collaborations I've had the chance to work on. The man, the myth, the legend that is Aristide Benoist asked if I'd want to design the next iteration of his site... and that was a quick yes. Going into it, he had ideas around an interaction model and type preferences... otherwise it was wide-open. And well... when working with someone like him, that wide-open can lend itself to almost endless possibilities– there's few (if any) people out there who can pull of what he can.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

gfdsgdsf

Working in a very iterative and collaborative manor, we navigated a lot of wild concepts while being grounded in a 60fps reality. Being the folio of developer who prides himself equally on creativity and efficiency, this had to walk a lot of lines. There were a lot more cool ideas we explored that ultimately got cut for performance issues to retain the 60fps bench mark, or to bob and weave around the nuances of WebGL loading jank. Super fun project though, and won Awwwards SOTM which made Mr. Benoist a happy man. Job done.

Ari_Book-Concept
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
I always liked the ridiculousness of the AT3-21 logo.. so I mapped it to a book for fun.
Ari-JWS_Promo4
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
A concept for teaser for the new site Ari and I were launching.
Ari_All-Your-Days
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Load-in transition for the project detail pages.
Ari_awards-grid
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Breaking down the construction of how his many awards are displayed. Not the most scaleable, but more unique.
Ari_Projects_Waka1
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_Projects_P+H
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_Projects_Mank
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_Projects_Canals
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_Projects_NewCompany
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_Global_symbols
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
A look at some of the Sketch component used on Ari's 2021 folio
Ari_About-1
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Final design of the about page. I wanted to push this a bit more, but landed here due to responsive issues and Ari's push for simplicity.
Ari_Landing-Exploration-1
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Always gotta explore the big type.. til reality kicks in. Trying to pair Ari + projects at scale.
Ari_about-transition-03
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
A transitional state to Ari's site, leaning into the Timmond typeface's similarities in form to the project routing tiles.
Ari_about-exploration-6
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Another exploration for the about page, and going rogue on some colors
Ari_about-exploration
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
A more long-form approach to handling the about page. I dug it, but Ari wanted something more concise and straight-forward.
Ari_process-2
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_about-alt3
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Simple type inset and masking for a possible about page
Ari_about-exploration-2
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Another exploration for the about page, and going rogue on some colors
ari_exploration1
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_load-in_002
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
An early exploration with Ari around load-in sequencing. Lots of type treatments in the mix.
Ari_Project_Waka
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
I think this is the iteration that sold Ari on this design system I had in mind.
Ari_Link-concept
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
All I can say is... edibles do some interesting things to interactive design ideas. A concept for oversized hover states that overlap.
Ari_grid-concept
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Ari_process-12
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
A WIP frame exploring some ways to meld a few different interaction models with... some success?
Ari_gallery-nav
.GIF
.JPG
.JPG
.mp3
.mp4
.JPG
.mp4
 ]
Different explorations for the project gallery navigation and how we display each item. Text? Number? Custom scroll bar? etc

This is certainly one of the more fun collaborations I've had the chance to work on. The man, the myth, the legend that is Aristide Benoist asked if I'd want to design the next iteration of his site... and that was a quick yes. Going into it, he had ideas around an interaction model and type preferences... otherwise it was wide-open. And well... when working with someone like him, that wide-open can lend itself to almost endless possibilities– there's few (if any) people out there who can pull of what he can.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

gfdsgdsf

Working in a very iterative and collaborative manor, we navigated a lot of wild concepts while being grounded in a 60fps reality. Being the folio of developer who prides himself equally on creativity and efficiency, this had to walk a lot of lines. There were a lot more cool ideas we explored that ultimately got cut for performance issues to retain the 60fps bench mark, or to bob and weave around the nuances of WebGL loading jank. Super fun project though, and won Awwwards SOTM which made Mr. Benoist a happy man. Job done.

[Desc]
Different explorations for the project gallery navigation and how we display each item. Text? Number? Custom scroll bar? etc
[Desc]
A WIP frame exploring some ways to meld a few different interaction models with... some success?
[Desc]
An early exploration with Ari around load-in sequencing. Lots of type treatments in the mix.
[Desc]
I think this is the iteration that sold Ari on this design system I had in mind.
[Desc]
All I can say is... edibles do some interesting things to interactive design ideas. A concept for oversized hover states that overlap.
[Desc]
Always gotta explore the big type.. til reality kicks in. Trying to pair Ari + projects at scale.
[Desc]
A more long-form approach to handling the about page. I dug it, but Ari wanted something more concise and straight-forward.
[Desc]
A transitional state to Ari's site, leaning into the Timmond typeface's similarities in form to the project routing tiles.
[Desc]
Another exploration for the about page, and going rogue on some colors
[Desc]
Another exploration for the about page, and going rogue on some colors
[Desc]
Simple type inset and masking for a possible about page
[Desc]
Final design of the about page. I wanted to push this a bit more, but landed here due to responsive issues and Ari's push for simplicity.
[Desc]
A look at some of the Sketch component used on Ari's 2021 folio
[Desc]
Breaking down the construction of how his many awards are displayed. Not the most scaleable, but more unique.
[Desc]
Load-in transition for the project detail pages.
[Desc]
A concept for teaser for the new site Ari and I were launching.
[Desc]
I always liked the ridiculousness of the AT3-21 logo.. so I mapped it to a book for fun.
Contact
Contact
Contact
Contact
Contact
Contact
Contact
Contact
J\V.S
Contact
Form
Have a collaboration in mind, or just want to talk? Fill out the form, shoot me an email, or connect on any platform.
[ Name ]
[ Email Address ]
[ Your submission has been received, and I'll be in touch shortly. ]
[ Primary Contact ]
[ Next Availability ]
June 2024
[ Prioritizing ]
Full time, Branding projects
[ Current Location ]
Los Angeles, CA