Jean interests in minimalistic design and timeless elegance. Photographing majestic landscape and striking portrait, with both functional and aesthetically pleasing. His work always reflects his artistic vision and sensitivity.

Jean Philippe

The Pixel Distortion Effect.

Inspired by Infinite Bad Guy Website (which is no longer active)

You can clone and change the following attribute inside the canvasContainer:
data-grid (default value: 34), //generate how many grid
data-mouse (default value: 0.25), //mouse radius affecting the distortion
data-strength (default value: 1), //higher = more parallax and distorted.
data-relaxation (default value: .9), //lower = faster pixel re-sorting
data-aspectRatio (default value: 1.77), //change Aspect Ratio according to your image size. (default 1920x1080)

It is recommended to use landscape images,
To calculate aspect ratio, you can do (image pixel width / image pixel  height)

Have fun messing around! ✌️

NB. There's also native text animation if you wanna try to play around with that one too.

Pixel Distortion Effect

It's a personal project of my recap 2022 portfolio. The goal is just a simple website with minimal animations, and showcasing some of my previous work, and hobby of making posters.

Please make sure to open it in live site for the full exp.

Chrls Folio

Saw this one video scroll by POSTEVAND that is pretty unique, and doesn't require lottie. Only small file, and simple render of MP4 will do.

Added Locomotive scroll for smoother scroll.
Clone it, and play around with the numbers you see fit. Enjoy!

Video taken from Postevand.com

Video Scroll Interaction

It's a copy and fan made project of Aristide Benoist website.
With WebGL and smooth page transitions of barbaJS.

Content inside are all my previous projects.

View live site for the whole experience. Thanks for visiting!

Folio (Aristide Benoist fan copy)

London-based digital artist and creative director Ondrej Zunka began experimenting with design and digital art after a creative pivot that followed a master’s degree in Economy and System Engineering. He has since worked with various esteemed design houses around the world and gained a reputable status in commercial design world.x

Ondrej Zunka

Liquid dots made with ThreeJS.

Inside there are shaders and code in the page. Feel free to play around with the value.

It was supposed to be a sphere, but I add a bit of morph to it, so it looks like a liquid. Feel free to like, share and clone! Enjoy!

Special thanks:
Original Shaders Code Experiment by Jaume Sanchez Elias
https://www.clicktorelease.com/blog/experiments-with-perlin-noise/

Liquid Dots Three JS

Smooth Transition between pages, made using Barba JS (latest version).

It was inspired by Kirschberg website https://kirschberg.co.nz and a continuation from Tim. Ricks @tricks Liquid Nav https://webflow.com/website/Liquid-Nav-Links

Feel free to clone, and like if you find this helpful! Oh and make sure to open it in LIVE SITE

Update: The code should be in the Project Settings > Custom Code > Before End of Body tag

Barba JS (Page Transition)

NFT has been a hot topic lately, and a lot of NFT artists are looking for devs to add "connect wallet" or smart contracts to their website.

I made a simple cloneable project for logging in and get user's Account using Metamask, and other providers. From there, you can either upgrade it to something like connecting contract to Solidity, Manifold.xyz, Etherscan, or maybe mint your artwork right on the website.

I'm using web3 JS, JQuery, and vanillaJS to make the Modal. 

Feel free to clone and like if you find this helpful!

Credits:
Background video by https://www.instagram.com/rostislav.uznv/

Updates feature:
1st April 2022 — Making transaction to specific ID(Sending ETH with customizable Gas Fee and other prices) & showing your current ETH balance.

Web3 - Wallet Connect

A simple website for my work. Personally, I don't fancy a lot of colors or things on my website, as long as it's simple and functional, I'm happy about it.

Charles - Portfolio

Lux Productions specializes in producing unique content for e-commerce, brands, realtors, travel agencies and event companies. In today's fast paced world of marketing, we deliver high quality film and photography services that will separate your brand from the industries leading competitors.

Proudly built with Webflow + Anime.JS + Vanilla JS + Scrollify + HoverIntent

Check out their official site: https://www.luxproductions.co