Vance Bell - Web Design, Web Development and Online Marketing » Information Architecture

Mag+ Beautifully Envisions the Future of the Portable, Digital Magazine

Vance Bell — Sat, 19 Dec 2009 19:19:09 +0000

Mag+ is a conceptual presentation by Bonnier R&D created to explore the translation of print magazines to handheld digital devices. While it illustrates only one possible vision, it is a compelling one that highlights many of the opportunities available to future reading technologies.

By making intelligent interface design decisions, they show how the engaging user-experience of the traditional magazine can be successfully maintained with digital material.

To say the least their ideas are sexy. I look forward to the day when the Kindle goes the way of the dinosaur and richly-designed multimedia content is available for a sophisticated device such as this.

Follow the discussion at the Bonnier R&D Beta Lab or on Vimeo.

FreedomPay Website Launch

Vance Bell — Mon, 10 Nov 2008 21:33:08 +0000

Mid-sized companies and larger corporations often find it necessary to revisit and tune their branding, identity, and messaging—not only to better appeal to customers and clients, but to increase their recognizability, fuel customer loyality, and inspire employee identification. This was no less the case for FreedomPay, the Newtown Square, PA based provider of cashless payment management systems and processing solutions.

To tackle this project, I teamed up once again with the very talented John and Amy Saal, the creative pair known as UNTUCK design. The result was a soup-to-nuts reworking of FreedomPay’s corporate identity, marketing collateral and corporate website.

Services Provided:

Project management
Information architecture
Web development (XHTML & CSS)

AroundMainLine.com Website Launch

Vance Bell — Tue, 30 Sep 2008 20:19:20 +0000

Launch day…it’s a recurring theme around here. But today is rather special, it’s the launch of AroundMainLine.com, the Philadelphia region’s first online magazine covering the Main Line, western suburbs and surrounding region. AroundMainLine.com offers readers great articles and features covering dining, going out, travel, fashion, shopping, people, local buzz and more. The e-magazine also offers regional businesses a great opportunity to tap into the elusive Main Line readership. While there are a few traditional, limited reach, print publications serving the western suburbs, this will be the first to effectively tap into a broader, and in many cases younger, audience. It will be exciting to participate in, and help drive, its growth.

Also, don’t forget, AroundMainLine.com is planning great launch party at Blush Restaurant and Bar in Bryn Mawr on October 16th. Want to come? Visit AroundMainLine.com and sign up to receive your invitation. AroundMainLine.com will be hosting more special events in the future, so keep an eye out.

Services Provided:

Totally Zen Blog Relaunch

Vance Bell — Sat, 07 Jun 2008 05:11:20 +0000

Totally Zen is a blog dedicated to yoga, healing, relaxation, and natural living — maintained by Philadelphia yoga instructor and massage therapist, Stephanie Churchill.

After a couple initial attempts collaborating with other designers and developers, Stephanie was referred to me by another client. We started the project by discussing the pros and cons of her previous blog theme and software. Much was good; some was bad; and a number of key features were missing.

The Blog Platform

As a blogging platform for the relaunch, we decided to use the newly released version of WordPress, 2.5.1. The price was right; WordPress is a free, open source blogging package. Furthermore, it’s insanely easy to use. The new 2.5 release also has a beautifully revamped administration panel controlling a bundle of new or improved features. Since I’ve used and installed WordPress for clients for three years, I can attest to its value, and this new release is a gem.

New Features

As I mentioned, the old blog was missing a few key features found on better blogs. Here are some of the new capabilities supported by the relaunched Totally Zen blog:

Search
Flickr badge
Most popular posts
Most recent comments
Tag cloud
Video support
Automatic image resizing
125 x 125 pixel ad support
300 x 250 pixel ad support
Gravatar support
Special “Widescreen” format for homepage images
Feedburner support
Asides (mini-blog) support

WordPress Plug-ins

Anyone familar with WordPress will know about the large number of plug-ins available for the platform. For those out of the loop, these independently developed plug-ins (created by members of the WordPress open-source community), allow you to extend the capabilities of your blog and manage key aspects of its behavior from the administration panel. Smart use of plug-ins not only eliminates much of the need for professionals like myself to be called in to deal with the “small stuff” of everyday bloglife, but adds real value to your blog and your visitor’s experience.

I have a personal set of favorite Wordpress plug-ins, and fortunately, they all made it into this project (along with several others).

Here’s the shortlist:

AddThis Social Bookmarking Widget

Helps visitors promote your website or blog by giving easy access to common bookmarking tools and social networking sites

Akismet

Akismet checks your comments against the Akismet web service to see if they look like spam or not. Spammy comments are tagged for moderation or deletion. I have one blog where Akismet has blocked over 10,000 spam comments. Far better than spending time deleting them manually.

All in One SEO Pack

Although Wordpress is already very SEO-friendly right “out of the box,” this plug-in gives the administrator the ability to fine tune elements of the site for even better search engine optimization.

Easy Tube

Pulls that YouTube video right onto your site where it’s supposed to be.

flickrRSS

Places your Flickr badge or photostream thumbnails on your blog

Google Analyticator

Easy management of the Google Analytics code required to track and understand your blog’s traffic and visitor patterns.

Google XML Sitemaps

Nothing is more boring that manually updating an XML sitemap. Do it automatically and notify Google, Yahoo, MSN and Ask.com without lifting a finger.

Most Commented

Keeping track and showing which posts have the most comments lets your visitors find the “hot stuff” faster.

Popularity Contest

The post-ess with the most-ess. Rank your posts by view popularity. Kick the information back to your readers, or check the numbers yourself and see what your readers like to read.

User Experience

After deciding upon the new features and plug-ins to be included, we reworked the overall structure and user experience of the blog. Many of features mentioned previously had already greatly improved the blog’s user experience, but there is always more to do. The blog’s categories were fine-tuned to better reflect the goals of the site. A post tagging nomenclature was developed to complement the new categories and offer users an alternative path through the blog’s content. External accounts for supporting services, such as Gravatar, Flickr, YouTube and Feedburner were established. Fit all of these elements together, and—Voilà!—a new blog that is far more flexible and friendlier than average. Much like Stephanie herself.

Services Provided

Strategic consulting
Project management
Web design
Web development
Information architecture
WordPress installation
WordPress database and content migration
Blog theme design modification
Copyediting
Training

Future Plans

Check back next month to see how the new Totally Zen online store shapes up.

Review: WriteMaps – Web-based Sitemap Creation Application

Vance Bell — Tue, 08 Apr 2008 05:54:09 +0000

Early in every website development project, there comes a time when you need to decide upon the information architecture. For a modestly sized marketing website, that means the creation of a sitemap. Generally, I like to accomplish this with a client over a nice cup of coffee or a couple productive stakeholder meetings. Sometimes however, because of schedules or distance, it is difficult to meet face-to-face. In these cases constantly emailing MS Visio or MS Word documents back and forth can be a bit inefficient. In searching for a better option, I ran across a free Web 2.0 style application known as WriteMaps.

In the words of WriteMaps creator Scott Jehl:

“WriteMaps is a free web-based tool that allows you to create, edit, and share sitemaps online. As a WriteMaps user, you and your team will be able to build and access your sitemaps from anywhere, without having to rely on proprietary desktop apps and static files.”

How it works

Building a sitemap

After you create a WriteMaps account, you are able to create one or more project sitemaps.

View the Workspace

Click the image below to view a full size version of the WriteMaps workspace containing a few samples pages.

Adding pages to your sitemap

WriteMaps provides a simple method for creating and deleting pages from your sitemap–click the green plus icons beneath any page to create another page linked to that page, click the grey “x” icon to delete a page. New branches are easily created or destroyed.

Page Info

Every page you create contains editable fields for the planned URL and notes.

View Options

While building your sitemap, you can work in either an indented outline or tree structure view. You can even toggle the view back and forth as you work allowing you to more easily work with sitemaps of varying structure. The zoom feature allows you to scale the workspace to get a better overall picture of your work, while in either view you can “rollup” and hide a branch of a sitemap to fit more on the screen.

File Options

WriteMaps allows you to save and reload working versions of your sitemap files. Additionally, you can export a compliant XML sitemap for post-launch search engine submission, or export or import a WriteMaps backup file to protect your data.

Collaboration and Sharing

Perhaps the best feature of WriteMaps is its ability to publicly share sitemaps with your team or client. Furthermore, you can allow other users to edit and resave the sitemap. This allows for a limited form of real-time online collaboration while, for example, conversing over the phone, Skype or chat. WriteMaps does not provide password protection of these public sitemaps files, instead relying on a long, random-string URL to cloak it from prying eyes.

Shortcomings

While offering a number of admirable features, WriteMaps does have several drawbacks. For instance:

Display of longer page names are often cut-off prematurely (at around 30 characters in outline view mode and 16 characters in tree view mode)
Resizing the browser window or switching from tree to outline view or back can lead to broken visual relationships between pages in both Firefox and Internet Explorer
Sitemap page load time can be annoyingly high with larger sitemaps (30+ second for a sitemaps of 35 pages). A server upgrade conducted by WriteMaps on April 3, 2008 has improved responsiveness at least marginally.
Font size of the page names are not editable (however overall size of icons and page names can be increased or decreased using the zoom function)

Summary

Although the application has a few drawbacks, WriteMaps can be very useful, especially for smaller sites. The collaborative capabilities are easy to use even for an uninitiated client or colleague. In many cases sitemaps for small to medium sized sites (10-50 pages) can be completed more easily using WriteMaps than MS Visio or other illustration software.

Innovation Philadelphia – Cultivating Philadelphia’s Creative Economy

Vance Bell — Tue, 02 Oct 2007 05:36:33 +0000

This past Summer SoftOrigins was selected to complete a redevelopment of the Innovation Philadelphia Web site. Founded in 2001, Innovation Philadelphia collaborates with Philadelphia region economic organizations to generate new ideas and programs to highlight and grow the knowledge and technology sectors of Philadelphia’s economy.

Innovation Philadelphia selected the regional design firm Untuck to execute a new logo and general site design theme. SoftOrigins provided project management, technical strategy, information architecture, front- and back-end Web development, hosting provider vetting and finally training services. A fully custom, integrated Web application allows Innovation Philadelphia staff to maintain their site in a flexible and efficient manner.

The site and its supporting applications were built utilizing current techniques and technologies including tableless CSS/XTHML, .NET 2.0 and MS SQL 2005. A new blog was provided via an implementation of Community Server 2007 with custom theming.

Everyone at SoftOrigins appreciates the care and effort the dedicated staff of Innovation Philadelphia gave to this important project.