Tag Archive: animation


In the video tools review, next up is Slidely. The name pretty much says it all.

Slidely is very easy to use, has a free version and makes beautiful slider-like presentations.

But, this is no video export. You can post to social media or embed on websites, but there is no download option in the free version. If you are assembling or repurposing some graphics that are already complete, Slidely can accomplish some beautiful effects for posting.

If you need actual footage or editing, Slidely has a Promo section complete with footage and music. The Promo has a unique price structure. You put your video together and then decide if you want to purchase. You can share the preview for free (check out ours here) or choose from the plans available.

The best feature of Slidely Promo is the ability to add custom captions to the footage.

Slidely Comic preview by Slidely Slideshow

Check out Slidely and let us know in the comments what you think.

Save

Save

Save

Save

Save

Save

Save

Techsnoop is always looking to expand her skills. If you are interested in making your own multimedia for your website or for customers, take a look at Adobe After Effects. There are many simple animations and transitions that can be accomplished with minimal skill. In addition, if you have a Creative Cloud membership, After Effects plays well with Photoshop and Illustrator. So you can create assets in your favorite program and pull them into After Effects to animate. Take a look at this video from Terry White, our favorite Adobe Guru and jump into something new this summer.

 

Send us a link to your masterpiece in the comments.

Speed Up Your Website with CSS

With more customers using mobile to access your sites, it just makes sense to make sure you have blazing fast load times. Customers on mobile will click off after just 2 seconds if your site does not load.

One of the things you can do to have faster load times is to minimize the amount of JavaScript or jQuery used. So how do you balance the awesome effects leveraged with these tools against the needed load time? Use more CSS transitions and animations in your site.

CSS has really expanded the range of effects possible without additional load on end users. One very popular effect for responsive design is the slide out menu. This effect allows users to have instant access to the menu with one hand and no fumbling!

This excellent video courtesy of Codecourse shows how to create a great slide out menu with only CSS and HTML. No snippets, no JavaScript at all. This video rocks and will take you to the next level as a designer. And if you want a great mobile website with this effect, contact DKemp Designs, we’ll be happy to help.

A Special Valentine

Techsnoop knows that not everyone has a “Plus One” for the Valentine’s Day festivities. So here is a special animated shout out to everyone still looking for that special person who understands design is a lifestyle not a job. And if you want regular design news, updates and freebies, sign up for our bi-monthly newsletter. Techsnoop does not share, sell or promote your email to anyone. Our newsletter is just for news and free goodies. In March we will have a random drawing for a design package.

And feel free to share this Valentine on Pinterest and other platforms, just please credit DKemp Designs.

Happy Valentine’s Day!

Techsnoop Valentine

 

Techsnoop loves to share free stuff and this week we found a great new font for headlines and other bold use.  But best of all, it comes in both a static .tff file and an animated AE file for motion and video work!

franchise font

Franchise is a collaboration of one type designer and 110 animators who each animated one element.  Every letter, punctuation and numerical character has a unique animation.  The color palette is limited to 4 colors and the animations are 25 frames each.  If you want to get started animating fonts in AE, this is a great download.

All for the low, low cost of a Tweet or FB post!

typogami

While you’re on the site, pick up Typogami, another great font with both animated and static versions for free.  Typogami’s static font is an .otf file.

Free fonts means you have plenty of moolah left over for coffee or Coca-Cola!  So pick up your free fonts, caffeine rush and get to designing.

If you use these in a project, let us know in the comments so we can see!

DKemp DesignsGreat design requires commitment and continuous education on trends and techniques.  Alone, it is an impossible task to keep current and revelant in this business.  Fortunately, the Web Design community is the most generous industry ever.  There is no shortage of professionals and geeks sharing their answers on time saving techniques.  DKemp Designs uses many sites and tools to meet customer needs.

Techsnoop has rounded up some great free resources available;

Give n GoGive ‘n’ Go

A wonderful site with great resources like animated menus, CSS animations, glowing buttons, all reworked from shots on Dribble.com.  Copy the HTML, CSS, javascript and you’re ready to go!

SVGenerator

This site generates SVG background code to create effects without large background images.  There are subtle patterns, stripes, even gradients and a starfield.  So, select one you like and edit the settings and colors.  Then download the code and paste into your site.  Easy just got a new home.

CSS3 Animation Cheat Sheet

Looking to spice up your site with some fast loading animations?  This is the site for you.

Select the animation effect you want, download the code, add to your project and away you go.  There are helpful hints to incorporating the effects into your code and any jQuery needed is posted with instructions.

So now you can concentrate on designing the fun elements and animate away.

Just For Fun

If you have been pondering whether to use parallax in a project, check out Cyclemon a site with a great example of parallax effect being used well, with purpose and not annoying.  The site states you are what you ride and shows each type of cycle in a great graphic with catagories like “Night Rider” and “Hipster” among others.  If the graphics appeal to you, they are available for purchase.

The_Avengers_Movie_by_Alex4everdnThere have been many tries to recapture the magic of the original Hulk TV series in movies.  But, until The Avengers, no one had gotten it “just right”.

If you are into design or animation you may wonder just what creative mix made this version of the Hulk work when others fell short.

Well, first there was the casting of Mark Ruffalo as Dr. Bruce Banner.  A wonderfully understated presentation of the genius is absolutely necessary for this character.  At the same time, he needed to be humble enough to be believed as a genius.  Mark pulls this off effortlessly.  He plays a man who just wants to be left in peace, but with enough I.Q. that this will never be possible.

Second, ILM took the approach of not just creating a monster and throwing it at the screen.  They used facial molds and motion capture to create a Hulk that looks and acts as if it is Mark Ruffalo morphed into the monster.  Check out the video for inspiration with your design and animation.

FREEBIES!

Fear not, faithful fans, here is today’s freebie;

A set of grunge brushes and the beautiful and useful Rothenburg font.  Happy designing!