1 |
@hakimel |
text |
2 |
Slides |
text |
3 |
Sign up |
text |
4 |
example |
text |
5 |
Flipside A button that seamlessly transitions from action to confirmation. |
image |
6 |
Sketch Toy Draw sketches with shaky lines and share replays with friends. My most pop****r project to date with over 500m views and 65m saved sketches. |
image |
7 |
Slides A platform for creating, presenting and sharing slide decks. |
image |
8 |
Progress Nav An animated progress bar that highlights sections of a page that are currently in view. |
image |
9 |
Ladda UI concept which merges loading indicators into the buttons that invoke them. |
image |
10 |
reveal.js Open source framework for creating HTML presentations. Support PDF exports, speaker notes, Markdown and much more. |
image |
11 |
Fullstack A game built out of checkboxes. Stack boxes and reach the top to win. |
image |
12 |
Rymd Move your mouse or swipe to navigate the stars. |
image |
13 |
Spiral Interactive spiral animation. |
image |
14 |
Monocle Scroll the page and see list items expand under the magnifying area. Inspired by a Flash site I saw years ago. |
image |
15 |
tick-tock Clock pattern animation. |
image |
16 |
Checkwave Check a checkbox to generate a wave of checkboxes. Because not. |
image |
17 |
Flexing Pagination Pagination arrows that "flex" when you hover or press them. |
image |
18 |
Cloud 3/3 in a series of CSS-only animations. |
image |
19 |
Spinner 2/3 in a series of CSS-only animations. |
image |
20 |
Hole 1/3 in a series of CSS-only animations. |
image |
21 |
Kontext A context-s***ft transition inspired by iOS. |
image |
22 |
Hypnos An infinite and hypnotic animation.3, 2, 1... You're feeling sleepy. |
image |
23 |
Kort UI concept for thumbnail previews. Hover over a single thumbnail to reveal it as a 3D stack. |
image |
24 |
Fokus Emphasize text selection by obfuscating the rest of the page. |
image |
25 |
Linjer Interactive experiment based on the visuals originally created for Radar. |
image |
26 |
Avgrund Modal concept which gives a sense of depth between the page and modal layers. |
image |
27 |
Meny Experimental fold-in menu. |
image |
28 |
Radar An audio-visual experiment which synthesizes sound in real-time. |
image |
29 |
forkit.js A fun twist on the GitHub "fork" ribbon. |
image |
30 |
Scroll Effects CSS-based scroll effects for lists. |
image |
31 |
DOM Tree A digital christmas tree made out of HTML form elements. |
image |
32 |
zoom.js JavaScript library for zooming in on DOM elements. Similar to pinch-to-zoom on a phone but programatically. |
image |
33 |
Rolling Links Experimental 3D hover effect for links. |
image |
34 |
Origami A colorful folding doodle. Click anywhere on the drawing — or use your keyboard — to switch layouts. |
image |
35 |
Sphere Thousands of particles animated in an ever morphing spherical pattern. |
image |
36 |
Textify Browse for or drag an image onto the page and watch it be reconstructed purely out of text. |
image |
37 |
Coil Minimalistic game based on quick and precise pointer movement. |
image |
38 |
Holobox A holographic effect based on device orientation. Only tested in Safari for iOS. |
image |
39 |
BreakDOM Ever wondered what it would feel like to attack a bunch of checkboxes with a radio button that's being steered by a scrollbar? |
image |
40 |
Yugen Logo An animated logo created for Yugen, a Canadian media production company. |
image |
41 |
Bacterium An interactive experiment with bacteria in a playful and dynamic physics simulation. |
image |
42 |
20 Things I Learned About Browsers and the Web An online book that aims to better people's understanding about the inner workings of browsers and the web.Created for Google while I was working at Fi. |
image |
43 |
Core Sinuous' sibling game. More evil red dots! |
image |
44 |
Sinuous A devilishly simple but challenging game. Your objective is to steer clear of the evil red dots and stay alive as long as possible. Also available for iOS, search for it in the App Store. |
image |
45 |
Bakemono A little monster that I brought to life with JavaScript. Bakemono is j***anese for monster. |
image |
46 |
Keylight A playhead travels between keys which resonate in sound depending on where they are placed in the room. |
image |
47 |
Blob Soft blobby physics. Imagine jelly, in your browser. |
image |
48 |
Magnetic Create currents of particles which orbit around magnetic nodes. |
image |
49 |
Trail Particle movement patterns that generate smooth trails. |
image |
50 |
Particle Depth Particle positioning patterns using depth. |
image |
51 |
Wave A wave with bubbles floating on the surface, the bubbles each represent a tweet with the word "water" in it. |
image |
52 |
Particles Particles slide across the screen and grow as they get close to the mouse. First thing I ever did using <canvas> |
image |
53 |
opensource |
text |
54 |
Slides |
text |
55 |
reveal.js |
text |
56 |
Slides |
text |
57 |
Twitter |
text |
58 |
GitHub |
text |
59 |
CodePen |
text |