Kibbles 'n Bits

I whipped up this 'logo' in an hour or two for my friend Ryan in the early early morning. It was a fun exercise and I think the result is great (commercially acceptable and great), and it includes all the cliches you can expect from me for my level of skillz: flat-style Illustrator shapes, nice shadows with transparencies and hue-based color changes, round and nicely-fine-tuned cartoons, and an overuse of stars on top "i"s.

It is also very "2000's indie", in the way that you got: handwriting fonts written by real hand not a computer, Web 2.0-style rounded fonts, ribbons, shape resembling a classic emblem but drawn like a cartoon, and lots of irony featuring animals running around happily in a environmental-friendly cage. Oh, humanity! (Originally I want animals running around with syringes to increase the sense of subtle irony.) My stand towards humans owning pets is ambivalent. I guess animals do want to be our friends, but I guess they think we are dreaming.

Anyway, I should do more time attack exercises like this and I'm glad I took the challenge Ryan gave me. So... now let's start earning some money!

Things Learnt From Making Trillian for iPhone

Phew! The week was quick! The idea of making Trillian work on the iPhone did not come around until two weeks ago, when we are convinced that Trillian Astra may be able to run on the phone.

There are a few engineering challenges concerning the connectivity of a mobile device, and design limits due to the size and processing power of the device. Since the iPhone is designed as a gesamtkunswerk (a total work of art), my main concern is to create a user experience that is as coherent with the iPhone itself as possible, while still retaining a brand identity: something that won't make an iPhone user feel like they are contaminating their dear phone, while keeping Trillian users proud.

Here are some quick things that just come out of my brain in regards of designing applications on iPhone:

1. Ergonomics: After dissecting the iPhone UI, I concluded a very simple rule: Buttons need to be the size of a finger. And it cannot be too close to each other.
2. Metrics: Apple keep sizes of things fairly straightforward, everything is around multiples of 10 pixels, which translates to 1/16 of an inch. A button is usually 40 pixels tall, which is a quarter of an inch.
3. Color: The iPhone interface, in fact, uses very similar hue ranges as Trillian Astra. But then all these are just guessing unless we can actually take screenshots from the phone.
4. Interface Inconsistencies: While reading from the iPhone applications, I realize that their interface is actually not very consistent: Sometimes the bottom is black, sometimes is blue, sometimes it's used as a status bar, sometimes a toolbar. Some screens are black, some screens are white. Nevertheless, it is still pretty tied together because it's intuitive and minimal enough.
5. Font: Apple loves Helvetica on the iPhone. Humanist fonts seem to go out of style when Microsoft begins adopting them in Windows Vista. Surprisingly enough, the phone includes Helvetica's archnemesis, Arial, probably for viewing Google, who is obsessed in the font.
6. CSS Compatibility: Most of the time was spent on getting the perfect CSS. I coded all the HTML using just <DIV>'s for reusability. It was a great experience to code a web page that works for just one browser. Makes you wonder why we should all suffer from browser wars. Safari on iPhone also spots some CSS3 features that other browsers don't have, and I can use them happily with no worries.
7. Testing: You need to have an iPhone to test no matter what. Safari for Windows or Mac may help you verify your stylesheets, but it will not reflect the exact rendering on the iPhone and the way user interacts with the application.

With that said, I have yet to get an iPhone... I know, it's harder to design if I cannot immerse myself into 'knowing' the device I am designing on.