Icon Work

2 May 2008 In: Graphic Design

Last week I spent some time helping out a colleague of mine with splash screens and icons for a mobile phone app. I used the opportunity to brush up my Illustrator skills. Tools I used in Illustrator include the pentool, the pathfinder palette(Intersect shape, merge, etc), filter(dropshadows, rounded corners, etc).

icons_work

The icons represent actions that include, Manage friends, New event, Settings, etc.

Twirls, Swirls and Curls

15 Apr 2008 In: Graphic Design

I spent a good part of Sunday doodling in Illustrator. For some reason I never transitioned from Photoshop to the vector way of things. But after getting my hands on Adobe Creative Suite about a month ago, I’ve been playing with Illustrator and things have been shaping up well. I like the fact that I’m not constantly trapped within a layer, as Photoshop would have me. Things seem more fluid in terms of workflow - selecting, grouping, etc. The tools I played with the most were the pen, twirl and pucker tools.

Here is a background I did using the pen tool. It’s taken a bit of practice to get the curves to be smooth and taut. Veerle’s pen tool practice sheet was very useful. Worth downloading if you want to get ahead in the pen tool race!

illus_1

Some of the leafy twirls were made using the spiral tool. Again, Veerle has an excellent tutorial on how to use the spiral tool.

Taxi Gone Wild

6 Apr 2008 In: Games

A good game if you’ve got some time to kill. What I like about the game is it’s simplicity. There are just five controls, the usual left, right, front, back keys and the spacebar for jumping. That’s what surprised me - that I could jump over cars!

taxi

The idea is to race other cars on a straight strip. The animation is also nice - especially the movement to change lanes, very cartoon-ish.

My Mac Won’t Start!

20 Mar 2008 In: PC Help

My Mac does start okay. But I still printed out this pocketmod and stashed it away in my bag, just in case. It lists several of the most common fixes for a Mac that will not start up properly.

pocket

The pocketmod website has a tool that let’s you create common pocketmods. Most are planners. It would be really handy to create a pocketmod cheat sheet for Adobe Illustrator or Photoshop. Maybe I should try and hack out one - came across this blank template which should come in handy.

Now if you like old fashioned paper organizers , then Picopad is an interesting idea. PicoPad Wallet Notes is a tiny pen and a pad of tacky notes contained in a stylish case about the size of a credit card, all of which conveniently fits in your wallet. Their other product is a Booksling, an elastic bookmark that keeps your pen and book right where you need it.

Great Site for Web Design Resources

23 Feb 2008 In: Art, Graphic Design

Here’s a great site I came across while surfing the web. A bunch of great web design tips and tricks . From the site,

Web Designer Wall is designed and maintained by Nick La, who also runs N.Design Studio and Best Web Gallery. I’ve been designing for several years and my works have been published on numbers of magazines. I love to share ideas and design techniques. Web Designer Wall serves as my public blog where I post my design ideas, tutorials, and talk about modern web design trends.

deswall

A post that shouldn’t be missed is one about the recent trend of using vector illustration to set site brand/identity. Joyent is a good example of where vector illustration works really well.

Making Sense of Gobbledygook - 1

19 Dec 2007 In: Gobbledygook

Have you ever sat in on an engineering meeting and wondered what they were talking about when the discussion veers into technical details? If you are a designer like me, I’m sure you have. I call these moments gobbledygook moments. So today, after coming across yet another gobbledygook, I decided to start a series on my blog to make sense of all the gobbledygook I come across. Since my blog doesn’t have too many readers, this is mostly for my reference. But to that lone person who does stumble by, hope you find it useful.

So what is my most recent gobbledygook? It’s called a “Cron job”.

So what the hell is a cron job? A cron job is an automated program that enables unix or linux users to execute commands or scripts (groups of commands) automatically at a specified time/date. But the term is also used to refer to any program that executes commands at a specific time or date. It may also be a daemon(a process that runs in the background) waiting for a specific event(s) to occur, which then triggers a set of commands. Typical cron jobs commands may include database backup scripts, that for example, automatically copy a mySQL database to a separate location on your site as a backup. Another example of a cron job may be a script or command that cleans up log files from your server.

For a demo of how a cron job is typically setup, here is a video of a cron job being set up for a Drupal content management system. The demo uses a web based cron service called called Webbasedcron. A web based cron service allows webmasters to schedule cron jobs online, without the help of their current hosting provider. Many hosting providers today do not allow for the scheduling of cron jobs or limit the user to one or two a day to save on bandwidth. A third party service allows administrators to point to the cron file or script that resides in their hosting environment and setup a specific date/time of when they would like to run the script.

That’s my gobbledygook implosion for the day.

Map Icon Generator

20 Nov 2007 In: Graphic Design

“The mapicon Factory is a browser-based application that allows users to easily and quickly generate graphic images in PNG format for use as map markers in Google™ Maps and Yahoo™ Maps…”

mapuiconu

Again, another handy tool to generate icon placeholders for storyboards or prototypes. Though these are map icons, you can create some generic looking shapes. The generator allows you to customize your icon based on marker shape, size, color and options to choose various graphics. Their blog mentions that people have created over 100K icons using the generator. That’s impressive.

Availabot

4 Oct 2007 In: Interaction design

availbot
This is an interesting experiment done by the two-man design consultancy, Schulze & Webbin in trying to give the web a physical presence.

Availabot is a physical representation of presence in Instant Messenger applications. Availabot plugs into your computer by USB, stands to attention when your chat buddy comes online, and falls down when they go away. It’s a presence-aware, peripheral-vision USB toy… and because the puppets are made in small numbers on a rapid-prototyping machine, it can look just like you.

Blog Spam

17 Sep 2007 In: Wordpress Help

Spam has taken on disturbing proportions in the decentralized, participatory nature of the emerging web! I found this out the hard way when I visited the Wordpress administration page for this blog - 3650 comments awaiting moderation. I wasn’t using any spam blocking software, so spam found it’s way straight to my wordpress administration page and to the database. That many entries don’t even load on a single browser page.

With a little googling, I found a technique to get rid of spam by viewing a few hundreds of them on a single page as opposed to viewing thousands. Here’s what I did: On the Wordpress administration page, go over to the ‘Comments’ tab. Select the ‘Mass Edit Mode’. The Mass Edit Mode allows you to deal with spam in larger numbers with checkboxes in front of each comment to help take action on selected spam entries. But that can still be tedious because it requires you to select each comment. A more convenient way to get to spam comments is to search by common words used within spam comments. Some of the words I used were ‘viagra’, ‘valium’, ‘porn’, ‘.biz’, ‘.ru’ etc. This allows you to take action on larger groups of spam without being concerned if you were deleting genuine comments; unless you have a genuine reader who want’s to peddle you some of that stuff!

wp1
Once search is complete, select the ‘Invert Checkbox Selection’ and click ‘Delete Checked Comments’.

But that still doesn’t remove spam entries from your database. These entries are dead-weight and unnecessary, and they can accumulate. This is true even if you use a spam blocking software like Akismet or Spam Karma though I think Spam Karma allows you to set options to purge comments after 30 days. Comment spam is stored in the database as a “just in case” so you can restore a comment incorrectly marked at comment spam. Anyway, to delete comments marked as spam in your sql database, log into phpmyadmin and do the following steps:

  1. From the left nav, choose the required database
  2. Choose the required table - comments are by default stored in the table ‘wp_comments’
  3. Select the SQL tab on the right content pane
  4. In the text box labelled ‘Run SQL query/queries on database mysql’, enter the following query -
    DELETE FROM `wp_comments` WHERE `comment_approved` = 'spam'
  5. Click Go. That should delete all spam entries from your table.
  6. Now go over to the Structure tab. Scroll down and under the Space Usage table, click on ‘Optimize table’ to clear any overheads.

sql

And that’s it. FWIW, I found Spam Karma much better than Akismet. Easier to deploy and Spam Karma gives you more control.

Designing Dashboards

15 Sep 2007 In: Information Design, Interaction design

Stephen Few talks about the thirteen common pitfalls of dashboard design. Stephen Few is the author of the book Information Dashboard Design.

dash

Two related articles are Dashboard Design: Key Performance Indicators & Metrics and Designing Executive Dashboards by Thomas W. Gonzalez. The first article provides an introduction to the basic building blocks of dashboards - Key Performance Indicators(KPI) and Metrics. The second article is a two part series that discusses how to determine appropriate key performance indicators (KPIs) and how to design a dashboard with the five most common KPI visualizations: alert icons, traffic lights, trend icons, progress bars, and gauges.

Dashboard design, as with the design of other artifacts, benefits from sketching and iteration. Richard Bath’s writes at length about it in his whitepaper titled, Paper Landscapes: A Visualization Design Methodology.

Paper landscape refers to both a iterative design process and a document as an aid to the design and development process for creating new information visualizations. A paper landscape engages all stakeholders early in the process of creating new visualizations and is used to solicit input; clarify ideas, features, requirements, tasks; and obtain support for the proposal, whether group consensus, market validation or project funding.

About this blog

Semantic stream is where I go fishing for inspiration. I log what I catches my attention or something that inspires me. It's where I hope to string together concepts and insights from various sources to create a promiscuous space where new ideas take shape.


Twitterati