cathie toshach polaroid picture

This is where I rant, ramble, or report the goings-on in my life, profession, or the world at large. Travel, photography, kitsch, and design -- just about any topic is likely to make an appearance. So while I'm chewing the cud, why don't you chime in with a thought or two of your own. I'd love to hear what you've got to say.

Patterns

Near Pier 1 in San Francisco there is a nice art installation of images on marble slabs in a Ben-day dots style, similar to Pointillism. Using the macro setting on my camera, I took some extreme closeups to capture the graphical patterns.

san_francisco_078v1.jpg

san_francisco_077v1.jpg san_francisco_065v1.jpg san_francisco_084v1.jpg san_francisco_063v1.jpg san_francisco_076v1.jpg

Weekly Inspiration #2

Lee LeFever of CommonCraft does a great job explaining the value of Twitter using paper cut-outs in this two-minute video. Being new to Twitter myself, I initially didn’t get what it was all about and then when I tried converting a friend recently, I found it all the more difficult to explain it’s value. The video simplifies the message just as the tagline suggests, “in plain English.”

(Source: CommonCraft on YouTube.)

Weekly Inspiration #1 (Debut)

Taking my daily stroll through the World Wide Web, I came across the website for Schematic, an interactive agency (via Communication Arts). Using Flex and Flash, the whole of the website is featured as one big page, which you can navigate using a traditional menu or by using controls to zoom in and out of the site’s content. It reminds me of the project by Jeff Raskin wherein you can, theoretically, zoom infinitely into the website’s content in order to view the minute details of a map or image while still remaining within the original spatial context of the web page. Similarly, this past summer at the TED conference, Blaise Aguera y Arcas of Microsoft Live Labs demonstrated Photosynth, which, putting it simply, reconstructs three-dimensional space by compiling images into a highly mutable, scalable, and navigable visual representation of a physical location. These technologies seem to be breaking away from conventional hierarchies and silos of information. Instead, by flattening the virtual landscape and creating new interactions and relationships between documents and data, users can begin to experience more personalization and control in how they choose to navigate a website or system.

Redesign Launch

Phew! Without further adieu, I am finally pleased to announce the launch of my newly updated website.

One of the primary factors for redesigning the website was to migrate it to a content management system (CMS). Since it’s a relatively small site, I chose to go with the open source platform of WordPress. Using a CMS should, in theory, make it far easier to maintain.

It’s been a lot of fun (and sometimes frustrating) working with WordPress and the various plugins and if fun is a factor then you can always count on being more involved. Any time I had to update the previous website design, which was entirely static, it was so arduous, that I just kept putting it off. Now I’m even planning new projects and topics just so I have an excuse to add content to the site.

I thought I’d take a few moments to summarize all the tools I used or incorporated into the website. This being my first endeavor into a full blown, customized WordPress website, I often knew how I wanted the website to behave but didn’t know how to achieve it. Through trial and error and slowly refined search terms, I eventually found all the tools that helped me achieve my goals. Hopefully, the list below will help you bypass some of the frustration I experienced being a newbie.

WordPress Tools

  • WordPress: An open-source, community-supported publishing platform.
  • WordPress Codex: Resource for all things WordPress.
  • Sandbox Theme: Simple WP theme that makes it easy to integrate your own style and layout designs.
  • Google SiteMap Generator: WP plugin that automatically generates a Google Sitemap, which helps to better position your website’s search results ranking.
  • Slickr: WP plugin that creates an AJAX Flickr gallery. I did not incorporate the gallery component, though it does make managing, accessing, and resizing images from your Flickr photo sets a breeze.
  • Lightbox: WP plugin for presenting enlargements of your images in a layer over the active page.
  • Add Lightbox: Paired with Lightbox, it automaticaly scopes your lightbox image sets to the given entry (or post.)
  • cforms: WP plugin for creating contact forms. It has a great admin interface, comes preloaded with several templates, and is also completely customizable.
  • aStickyPostOrderER: WP plugin that lets you completely customize the order in which your posts appear. If chronological or alphabetical aren’t sufficient, this is a great tool. I used it on my work portfolio so I could control the order by significance.
  • Force Category Template: WP plugin that allows you to create custom templates for each category. I used this to create separate headers for all my category-driven pages, including work, blog, and photos.
  • Get Custom Field Values: WP plugin, which takes advantage of WordPress’ custom fields by letting you control their placement and appearance. I used this for non-category pages to create custom headers such as résumé, about, contact, and all the error and search pages.
  • Get Error Message There: WP plugin that creates inline error messages. I use this for error handling on the comments forms.
  • Google Video Plugin: WP plugin that lets you places Google Videos on your website.
  • WP Cache: WP plugin that helps your website load more quickly. Rather than calling on the database each time to generate a page, this plugin creates static copies, which accounts for the faster load time.

Web Design Tools

  • Image Link: Script that creates a hover effect for image links. Works well but requires a bit of finesse with Internet Explorer.
  • Veerle’s Horizontal Navigation: Veerle’s Blog features great tutorials on graphic and web design, one of which helped me create the top navigation of this website using a fairly straightforward CSS technique.
  • Sticky Footer: CSS styling that makes sure that regardless of the length of your content, the footer will always appear at the bottom of the page.
  • IE7 Google Code: Script that makes IE7 behave like a standards-compliant browser. Most important feature for me is handling of transparent PNG images, which Internet Explorer does not currently support.
  • Yahoo! UI Library: The YUI Library is a customizable foundation for creating standards-based websites. Best feature is the Reset CSS, which clears out all browser formatting on HTML tags and lets you define them yourself.

Software

  • Adobe Photoshop: Graphic design software used to create design comps and photo and graphic elements for the website. (Mac and PC)
  • Adobe Illustrator: Graphic design software used to create logo and graphic elements for the website. (Mac and PC)
  • TextMate: The best ever text editor. Great tool for hand coding XHTML and CSS markup. (Mac)
  • Transmit: FTP software that offers a simple, straightforward interface for managing local and server files. (Mac)
  • Xscope: A really handy tool for “measuring, aligning and inspecting on-screen graphics and layouts.” (Mac)
  • OmniOutliner: List making application. It really came in handy for managing and prioritizing tasks for the website. (Mac)
  • Flock: This web browser offers a really simple and convenient tool for uploading images to Flickr. (Mac and PC)

Services

  • Jumpline: Web hosting company with the best customer service EVER!
  • Flickr: I use Flickr to host all of the images posted to my blog and photo sets. The convenience is in the management tools offered both by Flickr and through WordPress plugins.
1 Comment | Categories: Blog, Design

I Heart Robots

Bender would be so envious.  Japanese toymaker Take-G, has an amazing set of wooden robots that would put their metal counterparts to shame.

[Take G via Gizmodo via Crib Candy via Boing Boing]

2 Comments | Categories: Blog, Design, Neat Stuff