name

subject

project

requires

needCompleted

email

position

position.

To schedule a meeting, email me at

text

activity

country

aboutMe

file

Country

aboutSelf

Creative Dev

Digital Products

Commercial Web

Services

Website for Nigerian Trophy Extra Special StoutDesign: <a target="_blank" rel="noopener" href="https://www.makereign.com/">MakeReign</a>View live: <a target="_blank" rel="noopener" href="https://reclaim-your-dna.snp.agency/">reclaimyourdna.com</a>

Site is a part of a big campaign for Trophy Stout petitions Western museums to return Nigerian artifacts.

Reclaim Your DNA: digital interactive museum

VANA

Next.js

WebGL

Three.js

GSAP

Awwwards

The FWA

CSSDA

To create our website, we used Next.js as a front-end framework for building web applications, three.js, react-three-fiber for working with 3-D objects and GSAP for animations.

3-D gallery

Awards

R_Y_D

Reclaim Your DNA

A virtual interactive showroom for Matthew Fisher. Design: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://mfisher-apollonas.com/">mfisher-apollonas.com</a>

The Quarry House

Matthew Fisher 2022

Prismic

The second installment of a portfolio website for a NYC-based stone artist Matthew Fisher. Design: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://mfisher.com">mfisher.com</a>

React

Shopify

MFv2

An e-commerce platform for a well-established Egyptian sneaker and lifestyle retailer.Design: <a target="_blank" rel="noopener" href="https://dashdigital.studio/">DashDigital</a>View live: <a target="_blank" rel="noopener" href="https://fitsole.shop">fitsole.shop</a>

Fitsole

Emma is Social

FTSL

Site for a digital design studioDesign: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://heycusp.com">heycusp.com</a>

CUSP is a global team of specialists, focused on crafting world-class digital solutions for today’s modern companies. And like every good shoemaker it needed a pair of fancy shoes.

CUSP Site

Matthew Fisher 2021

The shoemaker’s child has no shoes: a website for the digital design studio

To unbind our creativity we needed something more than CSS and JS. On the front end, we used <a href="https://reactjs.org/">React</a> with the PixiJS and three.js libraries. The back end and CMS are based on <a href="https://prismic.io/">Prismic</a>. That allowed us to develop animations that cannot be created with conventional technologies. Shaders written with GLSL relocate calculations from CPU to GPU. That helps maintain high performance when it comes to rendering multiple complex animations simultaneously.

The overall aesthetic is minimal and bold, which pairs really well with the interactivity of the elements.

We worked through many combinations of animations and interactions to find a balance that worked for us. When brainstorming we have realized that none of the references were a perfect fit for an authentic look of the site. So we wrote custom solutions for a vast majority of animations and interactions ourselves.Running this amount of complex animations smoothly on any device, be it an old laptop or a smartphone, was a challenging task. The usage of shaders improved performance significantly. Combining optimization’s best practices with revising chunks of the project until there is no excess code resulted in further performance improvements. This way we made the site work at 60 FPS on most devices without compromising the visual aesthetics.

CUSP

A new generation of Hydrogen &amp; Fuel Cell technologyDesign: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://refire.heycusp.com/">refire.heycusp.com</a>

A company website for a leading hydrogen energy engines manufacturer.

REFIRE

A creative studio from Los Angeles, CA, working across a variety of design fields, with a focus on bringing human ideas to life. Design: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://humanperson.com/">humanperson.com</a>

A creative цуиышеу showcasing the vast catalogue of Human Person&#39;s projects featuring works with big names like Billie Eilish, Kanye West, and Post Malone.

Human Person

Erin Wesley

A curated collection of storied objects from Greek artisans by Eleni Eleftheriou.Design: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://www.syndesicollection.com/">syndesicollection.com</a>

SYNDESI

Webflow

SNDS

Syndesi

Capital Group is assisting clients in achieving their business objectives through consultancy and managementDesign: <a target="_blank" rel="noopener" href="https://www.makereign.com/">MakeReign</a> View live: <a target="_blank" rel="noopener" href="https://www.capitalgroupdc.com/">capitalgroupdc.com</a>

A company website for a Washington-based consultancy firm.

Capital Group

Amazing commercial interiors got a befitting residence for showcasingDesign: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://lironmoran-interiors.com/">lironmoran-interiors.com</a>

Portfolio website for an interior designer from Tel-Aviv.

Liron Moran

Showcase of the works of Los Angeles-based cinematographerDesign: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://eringwesley.com">eringwesley.com</a>

Portfolio site with several types of galleries for a Los Angeles-based cinematographer Erin G. Wesley.

Erin G. Wesley: standout portfolio website with easter eggs for a cinematographer

The focus for the entire experience is Erin’s incredible videography catalog. The main gallery creates a fluid and easy to navigate structure — built for speed so the user can cycle through multiple projects in a quick, dynamic fashion. There are so many easter eggs and little experiences within this seemingly simple portfolio site — but you have to dig around to find them. The most unique element on the site is Z-Space gallery, which allows to zoom into Erin’s creative catalog in an unexpected way. It’s a visually interesting way to view all of Erin’s work in one place, and is just a lot of fun to play around with. The gallery reacts to cursor position, and can be scrolled forward and backwards through ‘time’ offering a unique glimpse into the mind of Erin Wesley.

Erin needed an ability to manage all the new content she was generating. For content management we used Strapi, which was completely customizable and allowed us to build it specifically for Erin’s day-to-day site management needs. Because of Strapi&#39;s minimalistic interface it is easy to interact and work with content rather than navigate the dashboard.

AWARDS

Showcase of the works of NYC-based stone artist Matthew Fisher. Design: <a target="_blank" rel="noopener" href="https://heycusp.com">CUSP</a> View live: <a target="_blank" rel="noopener" href="https://mfisher.heycusp.com">mfisher.com</a>

Site for contemporary artist Matthew Fisher which was the beginning of a long-term relationship: led to two more projects and interesting technical solutions.

Matthew Fisher

Matthew Fisher:
a long lasting relationships

The site is a front-end React Web App that is powered by the Shopify Storefront API for e-commerce logic, products and most of the content. This allows us to create a unique design, embed cool galleries and animations, while maintaining the functionality of e-commerce. At the end your site will not only work like an online shop, but also look the way you want it. We have self-written custom approaches and solutions that help us overcome visual challenges. Most prominent are the custom scroll component and the prediction algorithm.

Technologies

MFv1

Selected Projects

Technology

Awards / Features

Ruby on Rails

React Native

Typescript

Python

Django

Half transparently social, half privately functional. Completely unifying the disconnected home industry in the USA.Marketing Site: <a target="_blank" rel="noopener" href="https://welcomeome.com/users">welcomeome.com</a>

Breathing exercises platformDesign: <a href="https://dashdigital.studio/">DashDigital</a>Marketing Site: <a href="https://findyourvana.com/">findyourvana.com</a>

Mobile app for a wellness brand that focuses on breathwork

A gentle rebellious studio who believes content is fire but social media is gasoline.Design: <a target="_blank" rel="noopener" href="https://dashdigital.studio/">DashDigital</a>View live: <a target="_blank" rel="noopener" href="https://emmaissocial.com/">emmaissocial.com</a>

EMMA

Vana: a breathtaking app

Mobile app consists of mindful courses and breath exercises with repetitive patterns and sound accompaniment. Main features of the app are personalized recommendations system for the users, tools for progress tracking and collecting feedback. The overall aesthetic based on sensations felt through the breathwork. Gradients, cropped and blurry photos create a unique atmosphere of balance and motion at the same time.

Facilitators use their dashboard to add breathing patterns and compose them into full courses with additional content to support the experience. We have developed a visual and easy-to-use Pattern Builder that lies in the core of the process. It greatly reduces the amount of extra steps needed to wrap up a finished course.

The Admin Panel is quite similar to Facilitator’s Portal, but has loads of extra features like content moderation, financial reports, user management, and analytics.

Next JS

Trophy Stout is one of the flagship brands of Anheuser-Busch InBev Nigeria. Brand decided to launch a campaign in order to challenge the British Museum, which holds captive over 900 objects from the historic Kingdom of Benin, including the Benin Bronze artefacts that were pillaged from Nigeria by British troops. The main part of this campaign was a website, enabling users to explore stolen unique artwork.

We saw exceptional results from this campaign, culminating in over 390,000 Nigerian sign-ups, the largest petition in Africa to date, 150 million earned impressions and 50 million Nigerians reached. With over 97 Benin Bronzes returned as a result of this massively successful campaign. This campaign was on the shortlist of the 2023 Cannes Lions Festival.

The website has a dual purpose: a digital experience that showcases the artifacts in a way that matches any museum, and to drive a mass social media movement demanding the artifacts return. The most challenging task was creating the impressive 3-D gallery of the original masks that users can interact with and explore, immersing them in the museum experience.

We spent a long time working with models, configured lighting, and used optimized textures to achieve maximum performance and visualization quality. Together with our partners MakeReign we created a digital experience better than any museum without the need for a visa or plane ticket.

CUSP is a digital design studio. Their target audience is pretty wide: from large global brands to startups and small businesses. They wanted to create something fun and experimental that gave some insight into who they are as a team, and would be explorative for users.

The site was warmly welcomed by the community and received numerous prestigious awards. Moreover, it is being featured in various compilations as an inspiration and example on such platforms like Mindsparkle Mag, Greensock, Commarts, and Codrops.

The website is relatively small in comparison to others, so we focused our attention on the feeling of using the navigation throughout the site. The pacing is something we worked on a lot. We wanted everything to feel responsive but a bit more relaxed.

We’ve always loved infinite scroll so we worked that into our main navigation. Also, our cases page has two different view modes, allowing visitors to cycle between a more interactive project-by-project layout or a speedier scrolling index.

Erin G. Wesley is a Los Angeles-based cinematographer. Her portfolio includes works for projects for Netflix, Nike, NBA and Snoop. She’s also an accomplished photographer and regularly travels the world in search of new visual inspiration. She needed a portfolio site — something she could leverage to help find that next great production project.

We used the React framework Next.js to build the website. To create interactive experiences and key visual features, we used GSAP, WebGL shaders and PixiJS. At the heart of the site — our own custom scroll, which we call amayzing SNP scroll. It helps to improve website performance.

From the technical perspective, the most challenging part was the video gallery on the Home page. To make this gallery work seamless, we needed to combine several technologies at once. We connected our aSNP scroll and DOM elements with Pixi.js and added shaders. The focus of the work was really on revising and optimizing the experience working with videos. We had to make them load quickly and play smoothly on any device, anywhere.

Erin reaches a global audience with her professional work, so we had to plan for a wide variety of devices, connections and experiences. Besides on the Home page there is a small detail we’re really proud of — the aspect ratio change for the homepage thumbnails. It’s a subtle element to make the homepage view feel slightly cinematic in a way, and we thought it was a lot of fun.

A digital showcase of the collection of a NYC-based stone artist Matthew Fisher. His work has been featured in the group exhibition, On The Verge and The Noguchi Museum. Matthew wanted a site that would highlight his art objects. This project is all about details and once you begin to interact with the site, they come to life around the art.

It has been viewed more than 50,000 times in the first 60 days, with some collections completely selling out. After the success of the website Matthew has reached out to collab on two other projects – a separate website for his second collection and an immersive digital exposition that was released under the name “The Quarry House”.

At the core of the site we have the aSNP scroll. We use our amazing SNP scroll for almost every project while improving its performance iteratively. The custom scroll component helps us to: ensure flawless interactions between components; synchronise HTML blocks with WebGL elements; listen to the scroll events and control elements of the site, and render only visible elements of the site to improve the performance.

Our favourite part is our self-written prediction algorithm. Based on the previous user&#39;s actions, it tells us which elements are about to enter the screen which enables user visibility. Not only does the algorithm help us to provide a smooth, seamless experience on every device, it also ensures high performance of fast-scrolling image galleries where the position of the items can change dramatically from frame to frame. Due to rendering time, there could be visual lags on sites like Matthew’s with 4K image assets. With our custom algorithm, no gallery item is left unseen even at a supersonic speed!