Application Design

Adobe’s Edge Tool Set in Five Minutes.

If you are a web designer or developer. If you make interactive content for websites, mobile and tablet based applications, you should familiarize yourself with Adobe’s Edge Tools and Services.

If you don’t know about them watch the short five minute video below, then go over to the Adobe site and dig a little deeper. With each release these tools get better, easier to use, and the quality of what they output improves.

Adobe has a major stake with this tools set, and I guarantee that if you do this kind of work, you’ll probably be using these in the near future in some capacity.

Stefan Trifan’s Minimal Weather.

I spent my Black Friday shopping on the Internet, and avoiding crowds. While bouncing around the cyber malls of the world, I came across this wonderful little screen saver for OSX. It’s free, it’s minimal, it provides information I can use, and it relates to where I am.

20121123-154637.jpg
You can download it for your city free here.

WTHR, Inspired by Dieter Rams and Braun.

WTHR, you can get it here.

If you are an iPhone user that is crazy about clean design, beautiful simple user interfaces, and clean graphics this app is for you. If you are into design, love Dieter Rams designed pieces for Braun, this app is for you. If you are looking for a simpler wether application for your iPhone, this app is for you. It won’t show you storm track Doppler radar, but it will give you current conditions in a quick easy read.

Designed by David Elgena, this app just got purchased and moved to my iPhone’s home screen.

Pennant for the iPad. Great Design and a Great User Experience.

I’m not a huge baseball fan, I haven’t been since the baseball strike a few years back. I have other issues with baseball too, my home town team sucks, it feels as though the teams are really set up so rich teams get all the good players at the expense of other teams sort of stacking the deck… I am however, a fan of good design, and good user experience design. This is why I have to say, I really like the iPad application “Pennant” from Vargaton.

This slideshow requires JavaScript.

Whether you like baseball or not, you will enjoy going through the data visualizations that are presented here in a clean and easy to understand format.The application covers baseball history, games, players, and stats from the 1950’s to the present. As the developer puts it, “This is an interactive exploration of baseball data that allows users to quickly and accurately recreate and investigate the history of the annual race to be the best team in Major League Baseball.”

This application is simple, and elegant with stunning graphics that make baseball attractive to even the most un-interested sports fan. It features a limited color pallet with easy to read typography, and charts. The application flow is simple, seamless and easy to navigate making the overall user experience one that encourages exploration.

Volkside’s Very Useful Wirify Web Page Analysis Tool.

When I design interactive applications or websites, I tend to look at a ton of stuff before I begin to get inspiration, and to analyze things like site structure and flow. I am a big proponent of not reinventing the wheel. If someone has done something you like, use it to your advantage. I’m not saying ripoff their design, or plagiarise their work, but instead look at what they have done, and use that inspiration to help you create your project.

Today I discovered a new tool to help me understand things like page structure and layout. The tool is Wirify from Volkside.  Wirify is a bookmarklet that lets you turn any web page into a wire-frame in one click. It’s lightweight and works in pretty much all modern browsers.  It’s easy to use Wirify. Simply drag the link with the green arrow on Wirify’s page to your Bookmarks toolbar. When you find a page you want to see in wire-frame mode, click the bookmarklet in your tool bar.

<iframe title=”YouTube video player” width=”480″ height=”390″ src=”http://www.youtube.com/embed/XgzPHFRx-xM&#8221; frameborder=”0″ allowfullscreen>

So, Why would you want to use Wirify?

Well there are bunch of reasons.

First: Wirify lets you strip away all the visual clutter and see the big picture, the underlying frame-work of the visual page structure. By tuning out the detail it lets you study the building blocks of the page and their relationships.

Second: The wireframe becomes a very useful redesign tool that helps prevent you from getting bogged down in visual clutter and detail in the very early stage of a website redesign project.

Third: Using the wire-frame is a great learning and teaching tool. Many of the design concepts that structure page layouts become easier to identify and analyze in a wire-frame. Think about things like visual hierarchy, whitespace, symmetry, chunking, grid systems, golden ratio, etc.