App I Use:

DTerm

@vancura

DTerm
The Secret of Teasers

The Secret of Teasers

Long time ago, in 2004, I was asked to illustrate, design and code interactive CD-ROM “Tajemství hlavolamů” (The Secret of Teasers) for the Albatros Publishing House in Prague. On the end the whole project (except the music and anti-cracking loader, both written by Vít Kavan) was done by me: that means GUI design and coding, illustration and animation and of course ActionScript coding.

vivus, bringing your SVGs to life

Vivus is a lightweight JavaScript class (with no dependencies) that allows you to animate SVGs, giving them the appearence of being drawn. There are a variety of different animations available, as well as the option to create a custom script to draw your SVG in whatever way you like. By Maxwellito.

Game Mechanic Explorer

A collection of concrete examples for various game mechanics, algorithms, and effects. The examples are all implemented in JavaScript using the Phaser game framework, but the concepts and methods are general and can be adapted to any engine. Think of it as pseudocode. Each section contains several different examples that progress in sequence from a very basic implementation to a more advanced implementation. Every example is interactive and responds to keyboard or mouse input (or touch). By John Watson.

iPhone 6 Plus Pixel Peeping

As you probably know by now, the iPhone 6 Plus renders things differently than every other iOS device to date. To developers, the device exposes a screen rectangle of 414 × 736 points, which the system renders at 3× scale into a backing store of 1242 × 2208 “logical” pixels. Since the iPhone 6 Plus display has only 1080 × 1920 hardware pixels, the backing store image is then downsampled by approximately 13% to the native resolution in an additional step. By Ole Begemann.

Dynamic Physics Animations

Create animations that flow naturally from the user’s movements. Rather than animating properties for a set amount of time, impulse takes a start position, end position, and velocity.

The Bézier Game

Learn all the tricks of working with pen tool in vector drawing applications. Also beautifully done!

Designer’s Guide To DPI

This guide is designed as a “get started” or introductory read for the starting to intermediate designer who wants to learn or get more knowledge about cross-DPI and cross-platform design from the very beginning. No complex math and un-parsable graph, just straight forward explanations ordered in short sections for you to understand and apply directly to your design process. By Sebastien Gabriel – check out his site, it’s amazing too.

Inspecting Yosemite’s Icons

Last month Apple released a preview of their new operating system, OS X Yosemite. Following the visual refresh in iOS 7, Yosemite features a significant visual change. Apple has added the familiar blur and translucent materials, a cleaner looking user interface, a new system font and updated icons. Analysis by Nick Keppol.

Visualizing Algorithms

Algorithms are a fascinating use case for visualization. To visualize an algorithm, we don’t merely fit data to a chart; there is no primary dataset. Instead there are logical rules that describe behavior. This may be why algorithm visualizations are so unusual, as designers experiment with novel forms to better communicate. This is reason enough to study them. (by Mike Bostock)

Mac OS X Yosemite Under the Magnifying Glass

Apple revealed a sneak peek into Mac OS X Yosemite earlier this week. Not surprisingly, Apple updated its desktop OS to match iOS 7’s design language. The new OS X now embodies a brighter and flatter styling, coupled with icon updates, font changes, and translucent materials. Here’s a quick look at the visual design changes in Yosemite and Min Ming Lo’s impressions of them.

Animate SVG Icons with CSS3 & jQuery

Recently, there’s been a lot of buzz throughout the web design and development community on using SVG for icons. Due to a number of limitations and inconveniences, using raster-based images for your icons, has become an increasingly painful and restricting endevour.

There are a number of reasons why a raster based image for the purposes icons, have become obsolete. I covered this and explored a number of viable solutions in this article here, which is worth reading if you are mostly unfamiliar with the use of SVG in web development. I explored a number of different methods of implementing icons including, pure CSS, icon fonts, and SVG. However a lot of people are still unfamiliar with SVG styling and implementation, as there isn’t yet a widely-accepted definitive way that works well.

Which brings us to this article. In this tutorial I will be showing you how to create, implement, animate and style SVG icons on the web using simple markup, without relying on any third-party JavaScript libraries.

I’m assuming, if you’ve made it this far, that you have at minimal, a basic understanding of CSS, HTML, a little JavaScript and Adobe Illustrator.

Essential Math for Games Programmers

As the quality of games has improved, more attention has been given to all aspects of a game to increase the feeling of reality during gameplay and distinguish it from its competitors. Mathematics provides much of the groundwork for this improvement in realism. And a large part of this improvement is due to the addition of physical simulation. Creating such a simulation may appear to be a daunting task, but given the right background it is not too difficult, and can add a great deal of realism to animation systems, and interactions between avatars and the world.