Design, Quick Tips

Fireworks Quick Tip: Using symbols to create consistent UI elements

I’ve been meaning to start a series of screencasts covering quick tips that I have gathered from my day-to-day work. These will include apps I use most regularly – Fireworks, Flash, Windows, Evernote and many more.

To start off, here’s one for Adobe Fireworks. When creating UI designs, elements often share the same properties, like buttons. If you create them manually, there is a risk of inconsistent styling and it can be a pain applying changes to the style. Using symbols in Fireworks, you can create consistent buttons and other elements that all look similar but can have different text for each instance.


Couple more blog posts published elsewhere

I’ve been busier writing for other sites than my own. Not the best situation to be in, so hope to change it in the coming days. In the meanwhile, here goes…


Recent contributions to other sites…

The last couple of weeks have been very interesting. Apart from my regular work and my first (and only) blog post of 2010, I also contributed to a couple of other website/blogs. Check these out:


My Top Tech of 2010

I’ve been working independently for just over a year now, after more than 12 years of 9 to 6 office hours. There are a lot of things I did differently in the last year, and a big chunk of that was the way I used technology. So here’s a roundup of the tech things that helped me make the best of my work and life this year.


Amazon KindleThe Amazon Kindle was by far my best acquisition of the year. Although it came way past the half year mark, it has fundamentally changed how I read, and for the better. I haven’t read too many books though. I use it instead to read blogs and articles, which are way too cumbersome to read on a backlit LCD screen. My workflow includes saving interesting articles to Instapaper, and then syncing them with the Kindle using Wordcycler.


KlokOne of the biggest challenges when working for yourself, is managing time. It’s way too easy to loose track of what you’re doing and how much time you spent on projects instead of goofing off on the internet. After trying out literally dozens of web and desktop apps, I finally settled on Klok2, an Adobe Air based time tracking application. It is still going strong.


GMailI went from someone who swore by desktop e-mail clients (especially Thunderbird) to an all out webmail user this year. And by web mail I mean the GMail interface. As of this point I have three domain e-mail accounts, all connected to the GMail interface through Google Apps. For the keyboard ninja in me, there doesn’t seem to be a better, more productive way to access e-mail at this point. While at it, extensions like Rapportive and Remember The Milk for GMail only make life more centered around it.

Remember the milk

Remember the milkTalking about remember the milk, I went back to it as my primary task management tool after nearly 2 years. There’s a whole slew of alternatives I tried in the interim, but nothing seemed to stick. RTM is not perfect, but it does the job for me better than anything else at this point. Also, the ability to do pretty much everything with the keyboard only adds to its longevity.


DropboxIf you have not yet tried or heard of dropbox, please go and check it out right away. Dropbox has virtually changed the way we back up, sync and share files between devices, and it only getting better. The premise is simple, anything you put in your ‘Dropbox’ folder is instantly uploaded to the cloud and to every device you connect your account with. I’ve been using it to share project files with colleagues and even with clients.


EvernoteI started using evernote a few years back, but never really persisted with it till a few months ago when they released a new, lighter and more powerful Windows desktop client. It is now my go to app for noting down pretty much anything. Heck, I’m writing the draft version of this article in Evernote. The ability to OCR text from inside images and make the searchable, and the availability on mobile platforms are bonuses.

Loads of Windows Freeware

WindowsThose who know me are already aware of my fascination for tools and productivity enhancements. This year more than ever, I experimented with a ton of small Windows freeware apps and actually stuck with a bunch of them. With a boatload of RAM on the new laptop, there was no reason to worry about memory usage with these always on tools. So my ‘essentials’ toolbox now includes TwoFingerScroll (to supercharge my laptop trackpad with multitouch goodness), Everything search (for lightning fast desktop search with zero overload of the higher profile alternatives), FARR (for keyboard driven application launching and more), Quick Cliq (for quick access to folders, clipboard and text snippets) and Digsby (for all-in-one taskbar access to all my IM and mail accounts).

I’m sure I’m missing stuff here, but these have by far been my top tools this year. How many of them will make it to the next year’s list and how many get beaten by better alternatives, we’ll see.


Top 5 websites for an unlimited supply of awesome wallpapers

Top 5 websites for an unlimited supply of awesome wallpaers

I remember back in the day when I was told not to use fullscreen wallpapers because they ate up too much precious memory and affected the system’s performance. Those were the days when we used to count RAM in MBs though. Now with gigs of RAM being so commonplace, the amount a high-res wallpaper image will use up accounts for mere decimals in the overall scheme of things. So why not then splurge a bit and get some awesome wallpaper images to show off that new LED backlit display you just upgraded to?

Now wallpapers come dime a dozen on the web today. The real trick is in finding the best of them and finding them often enough to keep the interest alive and have jealous eyes peeping over your shoulders all the time. Here then, is a list of top 5 sources to go to for an unlimited supply of awesome wallpapers.

1. Vladstudio

VladstudioFor years now, Vladstudio has been churning out a growing collection of some of the best illustration-based wallpapers. Minimalistic in nature for the most part, they never cease to inspire a ‘wow!’ when placed on the desktop. Also check out their wallpaper clocks category. It needs a software install, but the collection of clocks built shrewdly inside of their wallpapers beats any desktop clock widget out there by a mile.

2. Mike Swanson’s Wallpapers

Mike Swanson's WallpapersFor photography enthusiasts, especially those with an eye for macro photography, this one’s hard to beat. The updates are not very regular, but it’ll be a while before you use up the ones that are already there. You can also download the entire set in standard or widescreen format as single ZIP files. Great idea if you keep chaning your wallpapers often, or are using one of those wallpaper changer apps (or the one built into Windows 7).

3. DeviantArt

DeviantArtDeviantArt has been around for a long long time now, and continues to be one of the best places out there for the art & desktop customization enthusiasts. It’s wallpapers category is ferociously updated, so much so that finding good stuff from crap can be a task. My recommendation is to sort by popularity over a month or all time (look for the options in the top-right corner). You won’t be disappointed. Be aware though that the site does contains images depicting nudity as well. They’re not displayed by default though, so the site isn’t necessarily NSFW.

4. National Geographic Wallpapers

natgeoStraight from the horse’s mouth, you could say. Coming from the guys who invented the awesome in nature imagery, photography doesn’t get any bigger. If the most awesomest photographs out there are what you crave for, this is the place. A growing library of images from National Geographic, made available in the right size and shape just to adorn your desktops. Not all images are available in all 80 different resolutions that computer screens come in these days, but the sheer variety and quality of imagery makes up for that and then some.

5. Wallcoo

wallcooThis one’s a little different. To start with, it’s chinese (or japanese or korean; sorry, can’t read can’t tell). But who really cares as far as it has good images one can use!? The collection on this site varies from photography to illustration to anime and spans every possible genre out there. There are literally thousands of wallpapers to be found here, and the list keeps growing by the day. Most of the images are pretty good quality too. If you’re not exactly sure what kind of an image you want, this is the place to be.

Well, just in case you haven’t already left for one of the sites above and did actually make it till here, I’ll not keep you waiting too long. Go grab ’em!


Mindmapping at the speed of thought

Mind mappingMind mapping is a way to visually represent ideas and arrange them in a structure that is based around a central theme. Although the concept has been used for a very long time now – since as early as the 12th century according to Wikipedia – it has picked up a lot in the business circles over the last decade or so. The core idea is to document thoughts as they come to mind and build a visual map to form structure and hierarchy.

How I Mind-Map

I don’t remember how I got introduced to the idea of mind maps, but have been pretty much in love with them for as long as I can remember. Today, I use them for pretty much every bit of thinking or note-taking I do when in front of a computer. This is a quick run down of how I get stuff done through mind mapping and the tools I use.

Ideation & Conceptualization

I’m a big fan of picking up a paper and pencil and jotting down keywords as a starting point for an idea. If I weren’t as bad as I am with retaining my sketches, I would have reams and reams of paper with words and phrases scribbled on. For a while now though, the conservationist in me has been pushing me to transition to a more environmentally – and much more productive to be frank – way of using mind-mapping software.

The way I go about most stuff I think these days, is to start with the topic in the middle and start putting words all around it. Soon as I start seeing patterns, I add sections and move sets of thoughts within them. In most cases, I go as far as I can, close the file and then come back later to look at it again with a new perspective. More often than not, I find a new way to look at the relationships. Once I have something good enough to work with further – like writing the actual note, putting together a visualization or creating the graphic – I file the map and move on to the next tool.

Structuring Information

I spend a good deal of time at work reviewing and structuring content from clients, often to come up with course structures for learning programs. Given it’s ability to collate random pieces of information and build a hierarchy around them, mind maps come in real handy with stuff like this. As I review the content, I start dropping key words and concepts in a new mind map, using only the right side. Once done, I add logical sections and subsections on the left, then move the words from the right into appropriate sub sections.

Then, when I’m ready to document this stuff, I just copy the entire map and paste it in MS Word for a multi-level bullet list ready for descriptions and notes.

Meeting Notes

Managing a couple of teams and participating in a dozen projects at work means I tend to have a lot of meetings – enough to feel overwhelmed at times and confuse the outcomes of one with another. As is normal with most meetings, a lot of points get thrown on the table all along and it can very easily become extremely difficult to remember everything and identify actual doables from the mess. So much truer with meetings that involve heavy design discussions and brainstorming.

Well, you guess it. Mind mapping to the rescue. Adding every point discussed to the map and means that it is all there and ready to be reviewed and reconsidered as necessary. I tend to also  create a separate ‘Parking lot’ section that houses all the off-tangent topics that are either not directly related to the discussion or that threaten to drive the discussion away from the main goal. Once the meeting is over, it’s just a matter of exporting the map as a Word or PDF file and distributing it to everyone. For design discussions, I also tend to include the actual mind map image so everyone can refer back to the structure and connections.

Tools of the Trade

Although mind mapping evolved as a pen & paper technique, it derives much of it’s flexibility for me through software applications that allow for structuring and re-structuring of content without worrying about having to erase stuff that I’ve already written. A host of free & commercial applications are available out there, ranging from desktop applications to web & mobile applications. Here are my favorite few. For more, check out the list of tools on Wikipedia.


freemind Freemind is my tool of choice. Apart from the perennial appeal of an open source application, Freemind serves pretty much every requirement I’ve had till now. It is probably the oldest mind mapping application project on sourceforge and still the most active one. It is Java-based, so works on pretty much any operating system that supports Java. The interface is simple, intuitive and best of all, extremely keyboard-friendly. The last thing I want when documenting thoughts is to be fumbling with the mouse clicking things, so Freemind makes it super-simple to keep adding idea after idea without ever having to touch the mouse. To top it off, it has the most extensive set of export options in any tool I’ve seen – from images to plain text and everything in between.

If you’re looking for a quick way to get started with mind mapping, just head over the the Freemind website, download a ZIP package, extract to your hard disk and launch ‘freemind.exe’. No installation necessary. I keep a copy of the application on my thumb drive at all times, so wherever I go, I have the entire working application always available.

MindMeister If online access to the mind maps and collaboration is important to you, MindMeister is the way to go. There aren’t too many online mind mapping tools available on the web, but of thosse that are, this one is by far the best. It is not as feature-rich or fast as freemind is, but it does provide pretty much all the tools one would need to create their own mind maps in the browser without the need for any software installation. Also in active development, the application is updated regularly with new features. They also have an iPhone app, if that’s your kind of thing.

Pen & Paper

And if neither of the above cut the ice for you, plain old pen & paper should do the trick just fine. Although you need to remember that mind mapping on paper can get extremely frustrating at times and therefore requires tons of patience and practice to master. Personally, I’ve very of the former, so the latter is a bit out of question.


In the end, I can safely say that whatever your need, you are sure to find an application for mind mapping somewhere in your workflow. Above and beyond the uses I mentioned, I’ve heard stories of people who have been using them for project management, task management, flowcharting, even as creative writing tools. Go ahead, get creative and mind map at the speed of thought. And if you have stories of how you have or plan to them, feel free to share them in the comments section below.


Custom fonts across web browsers using CSS3

When I started learning web design, one of the most frustrating things to get used to was the inability to use fonts of my choice. Thanks to the limited set of fonts that actually work across all platforms, web designers have been restricted to a minuscule set of typefaces to build their designs around. There have always been the alternatives – plain old image replacement, sifr, cufon, among others – but none really seamless enough to drive mass adoption.

CSS 3 should solve that problem though. With most modern browsers beginning to adopt CSS 3 properties, using custom fonts is easier than ever now. Here’s a quick tutorial I recently recorded that explains how one can use pretty much any free font (I believe fonts have to licensed for use in the public domain to be of use here) and make your web pages work in any browser. This is guaranteed to work in Firefox 3.5, Safari 4, Chrome 3, Opera 10 and Internet Explorer 4 and above. Yep, you read that right. IE4 and above! Check out the video to see how…

[youtube width=”560″ height=”340″][/youtube]

Quick Tips, Technology

Quick Tip: Setting the default folder view in Windows

Let me start with a solution to a long running pet peeve – watching people change the folder view in Windows explorer every time they move to a new folder.

Windows XP (and I think Vista too) shows all folder contents in the ‘Icons’ view by default. I know very few people who actually find that useful though. Typically, any filename more than a dozen characters long is pretty much useless in this view, so whenever one want to read all filenames, they switch to the ‘List’ or ‘Details’ view. Here’s a quick tutorial on making sure Windows always lists files exactly the way you want.

[youtube width=”560″ height=”340″][/youtube]