Sketchnote Typeface

July 15th, 2013

Sketchnote Typeface
Just learned that there is a cool new sketching font out there. It’s called Sketchnote designed by Mike Rhode. He has used it extensively in his sketchnoting book as well. Looks pretty solid to me and could be beneficial alongside any electronic sketches. Enjoy. Cheers.
Credits: Mike Rohde

Sketchplanations

July 1st, 2013

Sketchplanations
So it turns that Jono, a UX designer at Nutmeg, has picked up some Moleskin Storyboarding Sketchbooks and set himself a goal of explaining something in sketch form each day. Hence Sketchplanations was born. Oh and beware, as these are all first time sketches, 100% authentic, with no corrections whatsoever. A great little inspirational project. Thanks Jon!

Credits: Jono Hey (@jonohey)

MicroPersonas – 41% Off

June 17th, 2013

Hey All. Just a quick announcement that I’ve been running a discount on the MicroPersonas icon set that is about to expire today. Instead of $29, it’s $17 for another 15 hours or so. Just wanted to share in here as well. Cheers. :)

Update: just realized that MightyDeals has extended the deal by another week.

InVisionApp: Now With Sketch Commenting

June 11th, 2013

InVisionApp Sketching
What do you get when you merge a pretty cool web based prototyping tool with some sketching capability? You got it – InVisionApp. These guys from NY have just launched a Sketch Commenting feature in their latest build. This now allows designers to express themselves more easily as words and pictures are more powerful together. They’re already awesome so no need to write anything else … “design on my friends” as they say. :)

Sign up for an account and give this tool a try (1 project always free).

Fries

June 10th, 2013

Fries
Fries (github) is a prototyping tool for Android devices. I think it allows you to spit out Android styled UIs just using HTML, JavaScript and CSS. Yes, it apparently plays nice with PhoneGap …

Description pulled from Github:

Fries is an awesome mobile development framework (yes, not just for prototyping!) for Android apps using just HTML, CSS, and Javascript and was inspired by Ratchet. We all know that you can find loads of iOS development tools out there, so this time let’s give some love to Android.

Credits: Jaune Sarmiento

Skeu It!

May 23rd, 2013

Skeu It!
Skeu It! – and perhaps here is the reason why people went flat with their design styles. :) It’s a parody tumblr collection of some weird looking interfaces with coffee switches, jean pockets and lots of wooden clipboards. The site is now closed off, but definitely proved a point of how ridiculous (or skewed) a UI can get when pushed to the other extreme.

Credits: Justin Maxwell (@303)

SIX UX

May 13th, 2013

SIX UX
SixUX.com is a collection of six second long Vine snippets of all sorts of transitions and animations (yup recorded by hand). Some inspiring short videos if you’re into moving pixel patterns. :) Overall I think transitions can be great if used wisely. Often they can lower the cognitive strain by helping people to understand what happens between two distinct UI states.

Anyhow, if you’re browser starts choking from so much video running all at once, there is also a tumblr blog as well. Nice work Andreas!

Credits: Andreas (@ThisisSIXUX)

Calling Bull$#!%: On Flat Design

May 1st, 2013

Calling BS
As the flat design trend has been recently surfacing in popularity it made enemies with a few good old friends of mine, some of which include: shadows, gradients, and textures. Taken literally, under the flimsy banner of honesty, flat design has ventured out against interfaces which resemble anything three dimensional or portray depth on a two dimensional screen. I’m calling bullshit on this for a number of reasons.

Please Don’t Steal My Design Elements

Back to basics from the time when I was still a graphic design student, I remember there were some fundamental design elements given to us to make use of. Armed with such primal elements as color, line and shape, we were one step closer on the road to respecting human perception above following ephemeral styles. We were learning how people see so that we could setup good visual hierarchies and differentiate between the more important and less important things on a page or screen. By not making everything look equal, but instead by making things larger or smaller, closer or farther, we could begin to guide the eye while grabbing people’s attention in different degrees.

Come today, two of these elements that are being attacked by flat design are texture and space (or depth). If this new awesome trend is now taking them away, then it’s ripping pages out of my graphic design text book and actually making me poorer as a designer. Not cool. As visual communicators we are stronger with more tools and techniques at our disposal, not less. I therefore respect the fact that human beings can see depth and there is nothing wrong with making a primary call to action large, shiny, and three dimensional. I am placing my bets that an embossed depth loaded button will be noticed more often than some ideologically restricted flat blob. From a business stand point, my clients will also be happier with a stronger conversion rate and a better ROI. From a usability standpoint, people will sweat less while trying to determine what is clickable and what is not (Bokardo seems to agree).

How Memorable is Flat?

One last other undesirable side effect of flat design (and any other minimalist, modernist, reductionist, clean or simple styles which have come and gone) is its potential to undermine human memory. Some time ago, in the context of charts and bar graphs, we were taught that chart junk is bad and we should keep our data-ink ratios in check while not succumbing to evil décor. But is this so? We have been warned that a purely simple and clean approach comes at the cost of making it harder to recall the information later on. Let this be a warning that extreme simplicity might not be the silver bullet after all if we’re striving for higher memory recall rates.

The fundamental thing about flat design is that it is a restrictive trend that ought to be questioned. Perhaps it’s cheaper to develop, design or maintain, but if taken in its literal interpretation it could result in a lower quality user interface. I believe that being respectful of people’s perception, attention, memory and the human ability to register depth, wins at the end of the day over following any stylistic fad. The answer probably lies within a more balanced approach and therefore – I choose not to design with one of my hands tied behind my back.

Credits: Jakub Linowski (@jlinowski)

Since more and more bullshit has been surfacing to the top lately, I’ve created a new bullshit tag to keep track of it. :)

Blackberry 10 Templates for Keynote and PowerPoint

April 17th, 2013

Blackberry 10 Templates
Blackberry 10 Templates has recently gone live as a sibling product to Windows 8 Templates by Jordan Gurrieri. As the name suggests, the templates contain some high quality customizable vector components themed in the new BlackBerry 10 UI style. The template is loaded with: a home screen, 80 royalty free icons, menus, forms, grids, activity bars, progress indicators, media player controls, sliders, drop downs, and the new BlackBerry 10 keyboard … you get the picture.

Why choose the BlackBerry 10 Templates? Jordan writes:

Quality and Attention to Detail.

BlackBerry 10 Templates was built by Jordan Gurrieri, lead designer and front-end developer at Blue Label Labs, as a tool to help our team quickly and easily mockup high quality app designs for client proposals, user demos, and developer requirements.

At Blue Label Labs we live and breathe app development, so you can be sure our templates are designed to detail specifications of the UI guidelines set out by BlackBerry. Your developers will love you when it is time to turn your mockup into design resources for development!

Finally, as this new platform evolves, we will be adding more commonly used design patterns and components which you get as part of the life-time free updates.

Grab them right here.

Credits: Jordan Gurrieri (Twitter)

GoodUI.org

April 10th, 2013

GoodUI
Good User Interface is my latest project with the intention of collecting and sharing UI design ideas in the form of a newsletter. It is also a running list of tactical tips for making a UI easier to use as well as increasing conversion rates. The project will reflect that a good UI is nice to both the business side as well as the people using it. As an experimental piece to the GoodUI project, I’ve also setup a Quora tag in case it stirs up any question-answer style discussions (started debating Prompts vs. Undos a few weeks back already).

As always, any feedback is more than welcome. Particularly, if anyone has any conversion ideas which they’d like to share, I’d love to have a look. Please reach out to me. Even better yet, if you could provide any metrics from A/B tests.

So would you like to receive ideas for making your UI better sent directly to your inbox? Sign up for the monthly GoodUI Newsletter today. :)

Credits: Jakub Linowski (Twitter)