This animation is inpired on the animated sticker packs for Google’s Messenger app for Android. This has been made with SVG + GSAP check out live code @codepen
Run Turtle
↧
↧
Cover animations
Example of transitions between project's preview and full page. Part of visual explorations for an agency portfolio website
↧
Zprávy — Breaking News In Your Pocket
Hey Dribbble!
While not a visual designer myself, I love to design motion and animated interactions via code and production-grade prototypes. I thought Dribbble will be perfect way to showcase some of my recent work — hope you'll like it!
Zprávy ("News" in Czech) provides an always up-to-date stream of news in form of a magazine, directly from the Czech Press Agency. Design goal was to provide a quick summary of daily articles in a super simple form of highly visual excerpts, while providing a seamless transition to actual article with one simple swipe.
Higher quality video is attached. You can download the app for free on the link below. No worries, it has an English edition, too!
https://itunes.apple.com/app/zpravy/id975314204
Thanks to @[67112:Pausrr] and @Vojta Ryšánek for the visuals!
This app was our first iOS-only project at our newly established full-stack design company Userbrain. More to come soon! Oh, did I mention we're available for hire? Drop us a line at hello@userbrain.co.
↧
Neon strokes
Only CSS with animation...see it on codepen:
http://codepen.io/judag/full/ojYYvm/
Thanks!!! :)
↧
The Worried Cat
I made this animation as part of an explainer site for a new app.
↧
↧
CSS icon color device
Only CSS with animation...see it on codepen:
http://codepen.io/judag/full/ByPMgz/
Thanks!!! :)
↧
hamburger menu
↧
Animation Flat Travel Paris Free template
( After Effects Template )
Download AE Project:
dropbox
https://youtu.be/OkCfFkeT74M
↧
Eir - Splash pages
As a finishing touch on the Eir rebrand, Kooba were tasked with designing and developing splash overlays for the Consumer, Business and Wholesale sections of the new site. The brief was straightforward, but very exciting: announce the change, let our visitors learn more or skip right through to the website. The exact opposite of a modal window, one might say.
Armed with Framer and some fantastic brand assets, we got to work and produced a prototype (link: http://share.framerjs.com/h9pys36c5xij/) and three versions of the design, coded and ready for implementation
↧
↧
Pink Ice
↧
Customer transactions
A side project with customer transactions thats been around for a while. Pizza section is feeling off, still needs some work. Here was the original shot https://goo.gl/pSiva2
Any feedback would be welcome!
↧
Blue - Jurassic World
Working on getting this guy moving. Almost done blocking in the poses and timings.
↧
Lighthouse
I have the bad habit of almost never finishing something back to back, especially when learning something before taking on a bigger project. So today my goal was to make a loop in after effects. So of course I made a lighthouse. Thanks @[464870:Ben Alcasas] for pushing me to add more detail to keep working on it!
↧
↧
Home → Account Transition Animation Parallax
I love all the Dribbble animation concepts with shape transitions and highly detailed fluff. But the fact is, once the animation isn't tactile and instant, you're adding friction. But I like the fluff, as long as the usability gets preserved.
This is a preview of Home to Account screen transition with an in-depth parallax effect with no performance issues. It is done in 3 simultaneous stages:
1) The Home UI elements are simply translated out of the viewport in 2D
2) The Avatar image and background are slightly scaled up (~1.5x)
3) Center UI of Account is scaled from 0 to 1, while the elements on edges are again simply translated in 2D.
This sequence gives a sense of more advanced depth than it really is, at least when interacting on actual device in hand. It is also accented when user goes back, with a subtle damping before the animation finishes.
The app called Steady is just being completed in-house and is going to be released by the end of the 2015 in Los Angeles.
Higher quality video and slow-mo version attached.
Thanks to @[67112:Pausrr] who made the visual and prepped the video.
↧
Logo animation
First time animating a logo. No After Effects, no fancy app. Just Apple Keynote, exported to QuickTime, then converted online to gif. Nifty.
↧
Shiaure Rec (North)
Logo for recording and production studio, which has some vintage equipment. Wanted to make it technical, cold and structured like the logos of some analog machine.
↧
Home → Contact Transition Animation
Simple transition between contact selection and actual contact screen.
Oscar is an app that allows your elderly stay in touch with you remotely. Me and @[67112:Pausrr] were in charge of UX/UI redesign. It was showcased on Tech Crunch Disrupt 2015 in San Francisco.
↧
↧
Fancy Oven Dude
Illustrated this for Harrison Metal + Dress Code.
Creative Directors: Dress Code + @[44468:Mercy Lomelin]
Animator: @[355650:Eddie Song]
↧
Login Screen for iOS Animoto
I worked with our awesome iOS Engineers to create this subtle and simple interaction for user login/account creation flow.
↧
Play it Loud
There's no such thing as "too loud" right?
↧
More Pages to Explore .....
