I got a wee mention in Decembers’ UK Edition of WIRED magazine, in a section called ‘Icons of the Screen Icon’. Nice!

TheDieline.com (a packaging blog you really should subscribe to) have lustworthy photos of the special media kit sent to promote Kraken black spiced rum.

Comment on this

The Desktop > Web > iPhone ecosystem is lovely. I have my design collection everywhere I go (also possible with the dropbox method I used to use, but there’s no way of tagging on the iPhone). The desktop client collects images and websites (as PDFs), and the iPhone client collects snapshots of sketches, camera photos and images saved from mobile Safari. Then the two ‘collectors’ get synced together to become one big collection:

Some more reasons why Evernote has struck a chord with me are:

• I’m not restricted to single images, I can add PDFs, group images together (as a note), and add text notes.
• I love the widescreen layout (above) where I can view thumbnails, followed a large preview of the selected item on the right – no need for anymore clicks or different screens to view it
• Importing content is so easy. The context menu in Safari offers ‘Add Image to Evernote’ and ‘Add Page to Evernote as PDF’. The latter gives me a complete web page (not a print stylesheet version), and any links are still active (not so with a PNG). The former works so nicely compared to some apps that get confused by links around images (cough, Littlesnapper).
• I’ve been experimenting with using a shared notebook to show moodboards/collected reference, and collaborate with clients, and this has so far gone OK. Would be even better if it was possible to layout images in a less linear way, and resize them, but that’s pushing the remit of Evernote.
• I find that I can often remember text within an image (especially as I often save a lot of found typography). Evernote’s OCR technology means I can find these images very quickly, and is often faster than tagging:

I do tag as well, usually marking content type, dominant colours and sometimes a possible project reference and a star rating. I’ve also started using it for things like a Cheese Diary, where I take a snap of the the cheese label, to store it for later reference:

There are still some negative points about Evernote:

• My main bugbear from last year still stands: Evernote makes it really easy to get all sorts of content in, but it still makes it tricky to get it out again in it’s original form. In particular multiple images can’t be exported easily – at least not without an Evernote branded border. It’s my data Evernote, not yours, and I resent the enforced advertising, especially with premium account. The ‘best’ way to do this is to export as HTML, and then fish out the images from the various ‘resources’ folders. Or drag and drop them individually.
• You can’t select multiple items and add new tags. The only way currently is to drag them to an existing tag in the sidebar, which isn’t intuitive, or easy (depending on how many tags you have).
• I would love to be able to restrict my view on the iPhone to a particular notebook.

Still, I love and use it despite these niggles, mainly because a lot of the things that niggled me last year (like thumbnails of images with loads of whitespace) have been fixed. Evernote development is ongoing and always improving, and I feel it’s a system I can put my trust in.

A tasty Flickr set of found typography – focussing on British/London Underground/Transport styles., which of course is right up my street.

Comment on this

This week I had the great pleasure of speaking at the 3rd Web Developer Conference in Bristol, along with Elliot Jay Stocks, Sarah Parmenter and Dan Donald.

It was only a one-day conference, but I had a whale of time, meeting new folks like Elliot Kember (who shone on the 2 panels he attended), Oliver Ker and the legendary Jon Tan, with whom I’ve had emails and chat but never met in person. I also got to catch up with Ben Hostler, the creative director of Bristol-based agency Beef, who I haven’t seen since I was at Middle School with him… 24 years ago!

The talk I gave was an update of one I gave at @media 2007, ‘How to be a Creative Sponge’. Back then, Flickr was really the only option for sharing design collections online, but a lot has changed since then. We’re now spoilt for choice, but I explained my current system of choice – Evernote. Like Fireworks, I have a bit of a love/hate relationship with it in the past, but earlier criticisms have been fixed in recent updates. In particular, I’m finding that I can ofter remember text in an image that I’ve saved, so the OCR technology in Evernote makes it easy for me to find items I’ve collected. I would even say it was more effective than a tag.

Download the slides as PDF (27.8mb). I don’t tend to write presenters notes, so I’ve added these afterwards to try and help it make sense. All links mentioned in my talk are available on Delicious under the sponge tag.

I came away with a really good feeling about Bristol – it has a great developer/designer community, in a city that feels friendly and very un-intimidating.

I also came away with a realisation that there is a whole book’s worth of material in ‘Malarkey’s Prank Calls’. Everyone I met seemed to have at least one experience of that delight to share ;)

Create a spooky Speed Dial background (1200×600 pixels and save it as JPG or PNG), and I’ll pick my favourite for a special Halloween edition of Opera! See this post on My Opera for details of how to enter!

Comment on this

In Squared I mentioned that I’d ordered both a Whitelines pad, and the Behance Dot Grid book to try out. After trying them both for a few days, I thought I’d just post a few words about them.

First of all, the Dot Grid Book. The packaging was sublime (see my photoset on Flickr), and the book itself has a rubberised card cover, wiro-bound, with good strong stock inside. The rubbery cover freaked some people out that I showed it to, and has the habit of collecting fluff!

There’s no show-through using black ink (maybe just the very, very slightest hint, but not enough to be a problem). The dots work quite well, and provide a lot of freedom. It’s also US letter sized, which is a change from A4. The only downsides are the that the wiro-bound spine gets snarled up (I’ve heard this from others, and experienced it already) and they felt the need to slap their logo on every page, which is a shame. Overall, a good idea, but really rather expensive for what it is (don’t faint -£14!). The more costly and elite a notebook is, the less I feel like using it. Too much pressure! I’ll enjoy using it, but I probably won’t be back for another one.

I found I preferred the Whitelines layout the most. The grid lines are still there, but the use of negative-space whitelines is just enough to draw by, without being too noticeable. The tinting drops out when copying, and every page is logo free! The binding was very good, but the only drawback was the weight of the paper. It’s fairly light compared the Dot Grid Book, and you definitely get show-through. On the A4 perfect bound pad that I bought that’s not a huge problem. It’s not nearly as expensive as the Grid Book, and feels OK to leave one side blank.

Looking over their product lines, my ideal Whitelines notebook doesn’t exist yet. I need one with a heavier no-show-through-paper, perfect bound with similar dimensions as my Moleskine sketchbook (21 × 13.2 × 2 cm). If by any chance the Swedish gods of negative space are listening -any chance of it?

Marshall Alexander creates wonderful one-piece paper toys, available as free PDF downloads for you to make, including the Max figure (right) having a wild rumpus!

Growing up in the seventies and eighties, my personal work is heavily inspired by retro design, videogames, movies, bright plastic toys and TV cartoons. Most of this work can be downloaded for free from my site. So get your knives and glue out, download some of the models and start building. Enjoy!

Comment on this

Comment on this

My name is Jon Hicks, and I’m a stationery fetishist. I’m sure many of you are too. I love the design, feel, and most of all, smell of it. Some of my earliest and happiest memories are of walking into WHSmiths and smelling the pencils and paper, looking at the pads and notebooks (and being allowed to buy a new one!). Even in an age when my work is solely screen-based, I still lust after the senses-satisfying joy of new stationery.

Just recently, I’ve started using graph paper pads again, particularly for sketching interface wireframes. I’ve tried plain paper, but I’m one of those people that can’t draw a freehand straight line to save their life. Then the wonkiness of the line just becomes a distraction.

I’d been using a Paperchase notebook, which had a very faint dotted line squared paper, but it was only a few sheets amongst a variety of other types. It was ideal, but Paperchase don’t make a pad or notebook of just this type anymore, so after fruitless local searching and googling, I asked for Twitter feedback on a suitable alternative. The response was fantastic, and here are the three best options.

The Original Designers Workbook (Available from the Design Museum Shop, although mostly out of stock at the moment) fits the criteria, as subtle graph paper pad:

Here’s a sample of it’s grid:

The most-suggested option by far was the Behance dot grid book (available in the UK from Strawberry and Cream):

Best of all though looks like the Swedish Whitelines series, as suggested by David Hughes (available from Foyles in London, Amazon and Papernation in the UK).

Rather than use the traditional lined approach, it uses the negative space, creating a less destructive white lined grid:

I should also mention the lovely Konigi Wireframe Pad, which also looked ideal, but sadly is US delivery only. Yes, I can always get someone in the US to send it on for me, but on principle I prefer not to. They offer a great range of free PDF templates that you print off, but that’s not a economical solution in the long term. Fine for the odd sheet here and there. Also, Inkjet prints just don’t have that lustfulness about them in the way new stationery does.

So, I’ve ordered both the Behance Dot book and a Whitelines notebook to try them both out!

I never liked the 2005-2009 Doctor Who logo. It looked too much like ‘Farscape’ to my eyes, but this, this I like. A lot. Somehow, it feels very retro, as if it’s the logo that could’ve been at some point in it’s early past. In particular, I’m a big fan of the way it works as a ‘DW’ Tardis logomark:

It’s absolutely the right time to do this. New production team, companion, and of course, Doctor.

If you’ve got 4 minutes spare, treat yourself to this video of printmaker Paul Catherall explaining how he produced the beautiful linocut prints that were commissioned by Transport for London under the title “A new view of London”.

The posters are available in the London Transport Museum Shop.

Comment on this

I don’t want this to turn into one of those ‘product blogs’ (you know “check out this cutter for making Helvetica letters out of potatoes”) but I wanted to share these mighty fine Lacie USB Speakers. There’s something very pleasing about their boldness and stark simplicity.

These aren’t the first speakers Neil Poulton has designed for Lacie though, they’re very much the lovechild of his previous firewire speakers, shaped like an ocean liner funnel:

What was special about these was that they didn’t need a power supply, unlike the new USB ones – they took all the power they needed from the firewire connection.

Update – now that proper details have emerged these do indeed run from USB or mains power, so yay! Thanks commenters!

I love Fireworks.

It’s been my tool of choice for a rather long time. In the previous year of working for Opera, I’ve used it more than any other app. Whether I’ve been working on interactive wireframes, UI mockups, icons or final production artwork, Fireworks is the one that I go to.

When people ask why I don’t use Illustrator or Photoshop I sometimes find it hard to articulate precisely why. Illustrator is undoubtedly best for print/high-res illustrations and logos, while Photoshop is the first choice for manipulating photos, especially for print. Each have some tools from the other, but neither is intended for creating screen graphics with vector and bitmap tools in the way that Fireworks is.

It loves pixels. Photoshop and Illustrator only ‘do’ pixels when they’re coerced, and by golly do they take persuasion sometimes. For example, in Illustrator, why does a 1 pixel stroke on a pixel perfect box, placed on pixel perfect co-ordinates have sub-pixels on the top edge? Why do I have to make the stroke 0.9px instead of 1px just to get a crisp 1px edge?

This is surely the most basic of things to get right? Photoshop can do vectors and some of what Fireworks can – it just makes it harder to do it.

What’s so great about Fireworks…

Pixel-snapping vector tools aside, it’s most useful feature (that still isn’t present in anything else I’ve tried) is multiple Pages and States. Why have 45 separate files for a set of icons, when I can have one file that will export to 45 individual files? Let’s say all these icons have the same background, like a typical OS X toolbar button, and you notice a glitch. To update all those files would be tedious, but because it’s in Fireworks on a shared layer (or Master Page) one update is all that is needed. Master Pages in particular come in handy with site designs, as each page can be a different size and canvas colour.

Here’s a sample working file of Opera Unite icons:

It contains five different pages (one for each pixel resolution) and 10 icons per page, each on a different ‘state’. 50 icons, one file, one export. I’ve attempted replicating this functionality with layers, layer comps and multiple artboards, but they don’t come close.

Every time I’ve worked on wireframes and mockups, I’ve felt blessed that I’ve got symbols. Anyone that’s used Flash will know what a symbol library is, but for those that haven’t, think of them like this: Reusable content. Take the example of a form button in a site design. I can create a button symbol, specify how that graphic can be resized (with 9 slice guides), and place it anywhere in my document. Again, updating and editing is a do-once, update every instance affair.

It’s not all roses though.

I also hate Fireworks.

With a growing passion. With each update we get more tools and features that I care nothing for – Adobe Air, Bridge and Flex integration and CSS export. Worst of all it’s become remarkably unstable, particularly under Snow Leopard. It crashes, even when you don’t look at it funny.

I use it because it’s the best there is, but there are a lot of holes that need filling for me:

• Auto-activating fonts. Whether this is down to Adobe or the developers of Font Managers I’m not sure. To get a newly activated font to show up, you need to restart Fireworks
• Export to Illustrator. Yes, this option exists, but it ignores gradients, transparency effects, and just about everything but the paths themselves. When I know that the artwork will be needed beyond screen use, I work in Illustrator from the outset, but there isn’t always that fore-warning.
• Placing items outside the canvas. A pasteboard area to place surplus artwork would make life a lot easier, and stop the ‘resizing the canvas cuts overlapping artwork’ pain.
• It’s taken to CS4 to get palettes that scroll with a scrollwheel, and even now, they don’t ALL do it
• In CS4, when using the ‘application frame’ you need to click inside the active document before commands like zoom work, otherwise it does nothing.

I really could go on, but there are also more general problems with the Adobe Creative suite:

• Expensive – not two ways about it, it costs a few bob, and it often feels like better performance/bug fixes have to be paid for. I upgraded to CS3, solely to have a suite that worked properly on an Intel Mac. It now feels like those CS2 days are here again with Snow Leopard.
• Bloated in feel: both with sluggish performance and barrel loads of features you never use. This can of course be entirely psychological.
• Keyboard shortcuts deviate from the OS X standard, and from each other. Command-H should always Hide the application, Command-1 should always show the the document at 100%.
• Installation: To reinstall CS4 recently took an hour, during which it also wants to take a big smelly dump in your Applications folder: Adobe Media Player, Adobe Drive, Adobe Bridge, Version Cue… STOP! Also – why make me close all my browsers?
• Licensing/activation process. I know this is an anti-piracy measure, but it actually makes a cracked version more appealing.
• Updating: Do I need to say anything here? It’s a dark land far, far away from the ease of Sparkle, where even the updater needs to update itself.
• Then there are those glitches with artefacts which have been creeping into Fireworks of late too. Blobs of pixels that aren’t really there, but show up because the screen hasn’t been redrawn correctly. Cumulative wasted hours trying to get rid of artwork that is a phantom.

Compare these gripes with an app like Opacity. It downloads quickly, you open it and it asks you if you want to place it inside the Applications folder – done! That’s installation. As for updating, it self-updates and lets you know what’s been changed. The least amount of friction, and you’re left with the feeling of being in control of what you’ve installed.

Now, at this point, I need to confess that I’m the worlds worst beta tester. I’ve been on Fireworks beta programmes before, but haven’t had much time to give feedback or bug reports. So it’s a bit rich of me to be whining on my blog when this is all feedback that should’ve been submitted.

The problem is, after submitting the 20th crash report of the day, I’ve lost faith that anyone ever sees them or acts upon them. Overall, it feels like Fireworks is at the point of no return – no hope of it ever being fixed or improved, only that it will get more bloated, buggy, non-native and expensive. A stable version will no doubt come, but we will have to pay for it in the form of CS5. Maybe it’s not the Fireworks team that’s the problem here, maybe it’s higher up at Adobe? Maybe it’s just my setup? I can’t tell.

The bottom line is: Fireworks was my favourite, cherished tool, and it’s unreliability and issues mean my daily workflow is badly disrupted.

So, my thoughts turn to competitors. I’m not the only one, others are fed up with Fireworks and are looking for something to use instead. John Gruber, using the analogy of Filemaker’s Bento app, hits the nail on the head:

Adobe shouldn’t scrap its existing software any more than FileMaker Inc. should scrap FileMaker. But where’s Adobe’s “Bento” for bitmap and vector image editing for the Mac? The Bentos in this space are coming from indie developers with apps like Acorn, Pixelmator, Lineform, and Opacity.”

For such a long time, there haven’t been any alternatives. Various apps have been born that compete with other Adobe Suite apps, like Lineform and VectorDesigner with Illustrator, and Pixelmator and Acorn with Photoshop. Nothing for Fireworks, and yet the need for screen graphics is surely growing daily? Not only with websites, but desktop software and mobile apps.

In the meantime, Twitter clients have become ten a penny and Omnigraffle has matured to become a truly great tool for multi-page wireframes.

Recently however, three potential alternative apps have surfaced: Drawit, Acorn 2 and Opacity. I’m going to be putting these apps through their paces, to see if they can be potential alternatives. That’s for another time though, as this post has gone on long enough!

However, initial trials are showing Opacity as the most thoroughly feature-filled contender, but with Acorn sporting undoubtedly the most thoughtful interface. Acorn also has the advantage in that it’s developer, Gus Mueller, is actively seeking feedback on how it can be more of a Fireworks competitor. Drawit also has a pleasing UI, but with some issues on rendering.

I’ll report back on these when I can!

The League of Moveable Type release the gorgeous open source font League Gothic, reminiscent of designers standard Trade Gothic. One for Jason in particular?

Comment on this