Archive for the ‘Design’ Category
My Very Own Panic-inspired Status Board
Posted in Design, on April 13th, 2010 by Carlos.
[Update: You can check out a Live Preview of the Status Board by reading my post, Panic-Inspired Status Board Live Preview Using HTML5 and contentEditable.]
I recently picked up a beauty of a monitor (Dell U2711) which left me with my 24″ Samsung looking for a home. Given that the displays are very different, I wasn’t truly digging the two monitor side-by-side idea, but did want to do something with it so I would have it handy in case when having two monitors makes life easier (working with presentation documents seems to make me wish I had the second monitor).
Anywho, I started to think about the Status Board that Panic created and blogged about a while back and thought I could do something similar to replace the white board I have next to my desk. In fact my second monitor is currently blocking the view of my white board, so I only found it appropriate! I basically wanted a glorified to-do list split up by clients, while having some handy information at my fingertips (time, weather and Twitter feeds). I had and still have some delusions of grandeur which would make this thing fully AJAX enabled where I can drag and drop items and lists, but I had to start somewhere, and I’m not quite there yet. The DIV’s that contain the lists do expand as you type more in, and the DIV’s themselves will automatically position them self in the page columns as the lists grow. It is by no means done, as I have several more tweaks I’d like to make to it.
I will likely break out how I created the Status Board over a few blog postings so I don’t glance over too many of the details, but here’s a quick overview of the elements I used to create it:
- The Status Board is really just a HTML page set to full-screen at 1920×1200 resolution . I had to use Chrome for this as other browsers/methods failed with the two displays. I also wanted to keep it based on Webkit, so I didn’t look at any Mozilla alternatives.
- Several helpful jQuery scripts and plugins including:
- The really nifty HTC-esque clock and weather that is displayed in the corner (jDigiClock)
- Real-time Twitter feed using Juitter
- HTML5 properties such as contentEditable to make the lists editable right on the screen, and localStorage to keep a copy of the list stored on the local machine (really only did this as I need some assistance with saving it to a mysql database)
- CSS3 layout properties such as columns, rounded corners, opacity and shadows
I must say, designing a site that you can control the audience, browser, resolution – everything – was fun, but surprisingly challenging. Old habits die hard, I suppose, but I really shouldn’t get use to developing sites for only one platform.
I’m hoping that this will provide a clever use of a secondary display and that I actually do wind up using it! I’ll do my best to share my findings as I enhance the web app further, at the same time asking for help if anyone is willing to provide it!
Karvt Introduces Wooden MacBook Skins
Posted in Design, on April 8th, 2010 by Carlos.
Karvt is releasing a line of wooden skins to slap on your MacBook’s for an extra bit of style. What’s neat is that they’re actually made from real wood. I personally like this Bamboo Caramel colour. There are also a few Artist series options that feature some nifty designs on the wooden backgrounds. Here’s a bit from their About page:
Our skins are personally hand-crafted and offer our customers a simple and effective way to completely remodel their computer. Our skins are made of 100% real authentic wood that use a professional grade 3M backing adhesive that sticks perfectly to your notebook.
Designers Toolbox – Die lines, contracts and more!
Posted in Design, on March 26th, 2010 by Carlos.
Here’s a great resource site for you designers out there. Designers Toolbox includes both free and paid resources that you will no doubt find useful.
Perhaps one of the coolest things offered on this site (and it looks free so far from what I’ve been seeing) are die lines for various brochure sizes/foldings, as well as size templates for postcards, business cards, DVDs, etc. It’s nice to have these things all together on one site.
Paid resources include country maps (something that I always find myself needing from time to time), and contracts and forms. The contracts and forms are templates that you can customize for projects and clients you are working with.
The site is definitely worth checking out! [Designers Toolbox via 1stwebdesigner]
More Inexpensive Resources for Designers – Envato Marketplaces
Posted in Design, on March 19th, 2010 by Carlos.

Earlier this week I mentioned MediaLoot, a resource site for designers. Thanks to commentor Don, I checked out his recommendations – the Envato marketplaces. Envato runs many sites that you may have already heard of like psdtuts+. Their marketplace sites are a series of sites that offer design resources for many applications. GraphicRiver is a marketplace for layered Photoshop files, vectors, icon packs and more. Its sister sites like ActiveDen sell Flash and Flex resources, while others are dedicated to audio, video, 3D and more.
The prices for the their resources start at $1, $2, or $4 depending on the marketplace. For example, a site theme purchased from the ThemeForest marketplace starts at $4 seeing as how the files you’d be purchasing there are more sophisticated and involved. To get the lowest possible price, you need to prepay to add money to your account. Seeing as your account works across the various marketplace sites, you’re very likely to find things to spend your money on. For whatever reason I had been stuck on iStockphoto for quite some time even to buy vectors, but I’m starting to realize that there is a lot more choice out there at much more competitive prices. [Envato marketplaces wiki]
MediaLoot – Offering Premium Graphic Design Resources
Posted in Design, on March 17th, 2010 by Carlos.

I’ve run across a premium design resource site called MediaLoot that seems to provide an interesting value proposition. It is a subscription-based site (currently $14/month, though they say it will go up to $29/month) that offers graphic resources like textures, brushes, icon sets and even templates to its paying members. They do not limit how much you can download in a given month (which most other subscription services do), so theoretically you can sign up for a month, grab everything and cancel. But that wouldn’t be very nice – and besides, they are promising continual additions so you will have more and more reason to stay subscribed. I’m happy to see a company offer something like this because it really means that they will need to provide a quality product to keep its members interested. And I hope that it doesn’t get abused so that it forces them to change their model.
If you start to compare this against other subscription based services like istockphoto.com, MediaLoot is certainly a bargain. However at the moment their resource library isn’t very large and of course does not come close to the size of the istockphotos of the world. But that is part of their draw as they claim they will offer only premium resources, so you don’t have to sift through hundreds of sub-par images/graphics to find what you need.
Given I easy spend more than $14/ month on istockphoto.com, but could never justify their restrictive and expensive monthly subscription, I might give this one a shot. There are already several goodies that I see there that I could put to use in my projects. It will be interesting to see how this community grows and what it has to offer down the road.
Go check out their site to see what they have to offer. They also have some freebies that you can use as sort of trial-run. [MediaLoot]
17 Logo Design Case Studies Compiled by DesignM.ag
Posted in Design, on March 17th, 2010 by Carlos.
DesignM.ag has compiled a list of 17 case studies on the process of logo design. The logo shown above is that for Vivid Ways, designed by Chris Spooner. It’s interesting to see the steps taken to wind up with the final product. This makes me want to work on some new logos! [DesignM.ag via Webdesigner Depot]
Free Web Icons, from Web Icon Set
Posted in Design, on March 16th, 2010 by Carlos.
Here’s a cool site, Web Icon Set, that offers up free web icons for use in your design projects. I looked at a few and they seem to be available for both Personal and Commercial use, but I recommend having a look yourself just to be sure. Visit the site to download various sizes and styles in PNG format. [Web Icon Set via Smashing Magazine]
Panic’s Status Board
Posted in Design, Uncategorized, on March 15th, 2010 by Carlos.
WANT. I think I’d be more productive with one of these. Though instead of bus schedules I’d have reminders to eat lunch and go outside and see daylight. [Panic Blog via Daring Fireball]






No Comments »