The Design Report

Dekkke: A Visual Tool for Managing Projects

Thomas McGee — Fri, 02 Mar 2012 19:39:21 +0000

For those who prefer a more visual and simplified approach to managing tasks, now there’s Dekkke. In Dribbble-esque fashion, Dekkke lets you upload “Snaps,” little 300×300 thumbnails of what you have to do and remember. If you’re a creative type, or just want a simplified way of managing projects, Dekkke is for you.

Color Matching Game

Thomas McGee — Wed, 25 Jan 2012 16:57:13 +0000

How well do you know your colors? Try this color matching game with a wide variety of tests from hue/saturation to tint/brightness. Developed with HTML5 and CSS3, this state-of-the-art tool is perfect for honing in and testing color skills. Also includes and experimental support for color blind users. Note: make sure your monitor is properly celebrated with use.

Auto-detecting Credit Card Type

Thomas McGee — Wed, 18 Jan 2012 16:03:15 +0000

There was a time when people thought the internet required a completely different payment method than the real world. After a very short period of time, everyone came to realize that credit cards were actually quite well-suited to the web, and so the credit card form was born. You’ve probably seen such form frequently and always with the same fields:

Your name
Credit card type
Credit card number
Expiration date

Time to Start Programming E-books

Thomas McGee — Wed, 18 Jan 2012 15:58:45 +0000

The dividing line between writing books and writing programs just got a big step blurrier.

That’s because Amazon has now released tools for creating books using Web technologies. Those tools include Hypertext Markup Language (HTML), used to describe Web pages, and Cascading Style Sheets (CSS), used for formatting.

“Through the use of HTML5 and CSS3, KF8 allows publishers to create great-looking books in all categories, particularly those that require rich formatting and design, such as technical & engineering books and cookbooks,” Amazon announced.

Changing a Page Title with jQuery

Thomas McGee — Tue, 17 Jan 2012 17:55:18 +0000

When working with various website frameworks and apps, the need arises frequently enough, to change a page title. Though a Javascript/jQuery solution most likely will not help your SEO, it comes in handy still for those who share pages on sites like Twitter, Facebook, and StumbleUpon.

By changing a page title on the fly, you’re able to control what users share by default, without having to tweak every plug-in you use. Here’s an example:

1
2
3
4
5
6
7
8
9

Background Images on the UINavigationBar

Thomas McGee — Sat, 14 Jan 2012 18:33:07 +0000

Toward the end of the development phase for the first release of Epicure, Adam Betts started sending me stellar design mockups. Many of his ideas were quite easy to implement. However, something as simple as adding a background image to a UINavigationBar was much harder than it should have been. You’d hope that as a class integral to iPhone UI development, UINavigationBar would have a setBackgroundImage: method. Unfortunately, it does not (at least not as of iPhone OS 3.1).

In the rest of this post, I will describe how, with a little cleverness, we can in fact configure our UINavigationBar to have any background image we desire.

Profiling CSS Optimization Notes

Thomas McGee — Thu, 12 Jan 2012 18:31:25 +0000

I’ve been recently working on optimizing performance of a so-called one-page web app. The application was highly dynamic, interactive, and was heavily stuffed with new CSS3 goodness. I’m not talking just border-radius and gradients. It was a full stack of shadows, gradients, transforms, sprinkled with transitions, smooth half-transparent colors, clever pseudo-element -based CSS tricks, and experimental CSS features.

Aside from looking into bottlenecks on Javascript/DOM side, I decided to step into the CSS land. I wanted to see the kind of impact these nice UI elements have on performance. The old version of the app — the one without all the fluff — was much snappier, even though the JS logic behind it hasn’t changed all that drastically. I could see by scrolling and animations that things are just not as quick as they should be.

Was styling to blame?

How I Made $19,000 While Learning to Code

Thomas McGee — Tue, 10 Jan 2012 23:21:08 +0000

The past year and a half has been quite a journey. I’ve gone from starting to learn iPhone design, to quitting my full time job and focusing on an application full-time. All while teaching myself to program in Objective-C with no prior programming experience.

OneVoice is a iPhone/iPad application that gives a voice to anyone who cannot speak. Either because they have had a stroke or have non-verbal Autism (or many other reasons), it is making a difference in the lives of a lot of people. OneVoice + iPad replaces a $7,000+ medical device that is bulky and difficult to use. My goal was to make an application that was both beautiful and easy to use.

Textarea Auto Resize

Thomas McGee — Mon, 09 Jan 2012 19:30:15 +0000

On a current project, I was trying to find a way to auto-resize a textarea according to some content that would be loaded in dynamically via Ajax. I didn’t know the height of the content and the textarea element doesn’t resize naturally like other HTML elements, so I needed to update the height of the element with JavaScript each time the content changed.

It seemed like a simple task. After doing a search to see what types of plugins and scripts were floating around to do this, the examples I found seemed a little overly complex. While most solutions seemed to incorporate some complex math calculations, I thought of a better way.

ShareShelf: A Book-themed Sharing Widget

Thomas McGee — Sat, 07 Jan 2012 00:19:11 +0000

ShareShelf is a simple and useful tool to encourage readers to share your content. Featuring five of the top social media sites, ShareShelf integrates bookshelf-themed icons with easy-to-use pop-up windows for quick shareability. Use the ShareShelf on:

Websites
Blog Posts
Product Pages
Landing Pages
Book Promotion Pages
Micro Sites