web_based | Entries tagged with project release

I've been pretty quiet about the work I've been doing at Crispy lately. This isn't so much because it was all hush-hush like the Microsoft stuff so much as because it wasn't terribly exciting.

This morning saw the launch of the new universal navigation for vw.com. That's the shell that surrounds all of the content, and consists of the top dropdown navigation, the footer, and the left navigation (when it is present).

I didn't work on those things, obviously, since they are Flash and I don't have that skillset. What I did is the Model Lineup widget. This is pretty much 100% mine. Usually lots of people have their hands in things here at Crispy, but this one is all mine. So if you want to see how I write HTML, CSS, or Javascript, this is your chance. I'm very pleased with how it turned out.

Some of you may notice strong similarities in the interactions and functionality of the Flash-based top part of the universal navigation and those of the Model Lineup. Obviously it wouldn't be hard to do the Universal Navigation in HTML instead of Flash, thus making things even more accessible. However, the Universal Navigation widgets are used on other sites, including several thousand dealer sites throughout the world. Flash is actually a better tool for this, since it is essentially added to a page via an include. If we had done it in HTML, anyone who wanted to use the universal nav would have to do much more than copy-and-paste a few lines of Javascript.

Next week will come the release of the new Features and Specifications pages, which we are QAing right now. I did a lot of work on those too.

I'm a PC, and I built this website.

This is what I've been doing for the last four weeks (longer than that, actually...we've been sprinting for four weeks, I was doing the dev for about a month before that). Please note this is an entire DHTML webapp done with semantic markup, standards-compliant Javascript, and progressive enhancement. Also modern browser support (though some bits are still a little off in IE6).

At the moment we're having some glitches with server farm integration, but we'll get them ironed out shortly.

The markup is mostly mine, about three quarters of the CSS is mine, and about half of the scripting is mine. I laid the foundation, and I produced the DHTML prototype/proof-of-concept (which helped convince Microsoft to go forward with the project).

The site that has been keeping me buried alive since mid-July has finally launched!

www.steamboat.com: The Official Site for Steamboat Ski Resort and Steamboat Central Reservations.

As always, if you don't like Flash you can avoid it by disabling Javascript. For the most part you won't even miss it. (God I love making sites like that.)

This would be a site that we quoted at 60 pages and turned into 230+ pages. Can you say "Scope Creep," boys and girls?

Even so, the project was managed beautifully by our team. You can't really see some of the application goodness involved in the site (though if you go to Plan Your Trip > Lodging and then do a search using the Search For Lodging widget you can see some aspects of it) because it's so well-integrated into the content. There are parts of the new CMS and admins that are pure interface development porn.

Best bits are the Mountain Cams (only one of which is online at the moment) and the Photo of the Day. The Mountain Cams are Flash-based, but streaming interactive video is pretty much the perfect use for Flash.

This is the big one that I've been working on for a few months now.

Rocky Mountain Health Plans, a non-profit health insurance organization, has an extensive site with lots of content. The site was originally done back in 2000, and was coded entirely using layout tables...so the HTML was all tables within tables within tables. It's been a nightmare site for us to maintain.

Recently, they wanted to re-optimize the site for larger screen widths. This would have been a nightmare with the site being coded the way it was, so we convinced them to let us redo the entire site in a CSS based layout. So basically I redid the entire site, by hand.

Witness the new RMHP.org website. Completely semantic markup. CSS-based layout. SEO optimization. The old javascript-based dropdown menu is now a CSS-based dropdown menu. All of the site content is editable in our content management system (so already some pages don't validate because of cutting-and-pasting content from Word *twitch*). The headlines are all rendered using sIFR, so they, too, are CMS editable, which is a neat trick--before, whenever they wanted to change a headline we had to produce a new graphic for them. Now it's all editable.

Aaaaahhhhh, it feels so good to get some of these projects off my plate.

The Baker Organic is now live: http://www.bakerorganic.com

Special things to note about this site is the heavy use of PNGs with alpha transparency. The interface development team is considering officially supporting alpha transparency in PNGs--which would be a nifty thing to have in our toolbox, except getting IE6 to do it requires extra implementation. So I used this project as a trial balloon for it, really pushing the limits.

As usual, the Baker Organic site employs fully CSS-based layout, semantic markup, and SEO optimization.

Another project of mine has gone live:

Pronghorn Estates. Warning: Flash-intensive with background music (the client insisted on the latter over our objections).

So, you may be asking, "Dude, that's, like, a 100% Flash site. What did you do for it?" True, it's mostly Flash, but if you disable your Javascript (or don't have Flash) you'll see another, completely accessible site. That's what I worked on. Both the Flash and the HTML versions of the site draw their content from the same database, so you should get comperable content either way. We did this for SEO (Search Engine Optimization) purposes, but it provides a nice accessibility base as well.

The site also features deep-linking: you can bookmark the individual flash pages. This also provides the capability of using website analytics packages, too. We use Google Analytics by default, but can use anything the client wants.

ETA: Fixed incorrect linkage in URL. This is what I get for blogging before any caffeine intake.

Ladies and Gentlemen, I give you the project I have been working on for the last few months:

National Cinemedia - Fathom (caution: contains flash and makes noise; content is worksafe but loud)

SEE! CSS-based layout and interaction! (Turn off CSS to witness Bonus Accessible Semantic Markup!)

HEAR! Standards-compliant multimedia, XHTML, and CSS!¹ (Turn off Javascript to witness Bonus Alternate Content for the flash nodes!)

TASTE! An experience that is platform and browser independent!

SMELL! A pixel-perfect implementation of a graphically-intense design which includes drop shadows and gradients (and even drop shadows on gradients)!

FEEL! Jon being insufferably pleased with himself!

And the consumer-facing pages are only about a third of the project. The rest of the project consist of a back end administrative interface, which allows the people at Fathom to create/edit events and series of events; to approve event comments; and even to make inline edits to the content on the consumer pages! (Plus about a dozen other functions.)

*sniff* My baby is all growed up.

Of course, it's not all mine. I was the interface developer on the team, which also consisted of our .NET application developer, a designer, one of our Flash developers, an Information Architect, and the Account Manager. So it was definitely a team effort; in fact, I barely touched the administrative interface.

So...Go Team Fathom! For Great Justice!
_________________

¹Offer not valid for pages that contain unverified content from the database.

Another project of mine went live today:

Playground: The Cache at Union Creek. This was a pilot .NET project for us, and I was the lead interface developer on the project (actually, I was the only iDev on the project, so I'm claiming lead by default). The design and Flash work were done by Matt, and I stitched it all together using standards-compliant XHTML, CSS, and JavaScript. There is not a table on the entire site, not even on the Get In On The Secret page. It's not a particularly big project, but because it was a pilot project it took some extra time and effort. Matt definitely bore the brunt of the content and programming with the requirements for the Flash modules, and there's still more to come for later versions of the project.

Next up: National CineMedia. I already have a fantastic design in my hands and I'm doing it all in CSS-based layout. I'm going to try using sIFR to keep things pretty and accessible, so that'll be a fun challenge. This is also a .NET project, with much heavier backend programming (we're on Version 7 of the backend wireframes already). Projected launch is mid-March.

After many weeks of hard work, we're releasing a project:

Gallavants!

This is the first kid's site I've ever done. We have a couple of quick changes yet to do to bring everything into COPPA compliance, but it's good enough to launch.

If anyone out there has kids that would be interested in taking a look at the site, I'd love to hear what they have to say.

Point of professional pride: It's a flash-intensive site, but it's compliant with the XHTML 1.0 Transitional standard. (Mostly. Any page with a form will have issues, since our Java back end does not produce compliant HTML.)

Today marks the launch of the project I've been devoting most of my time to:

http://soloquote.rmhp.org/home

This tool enables you to compare health insurance plans, get a quote, and apply for coverage. The tool takes all of the necessary information for determination of elegibility, and even allows you to log in later and return to an unfinished application, or see the status of your application. (It's safe to play with up until the "Yes, Apply Now" button on the Confirm Plan Information page, if you want to see the first few screens. There's about eighteen more pages after that.)

On this project I was responsible for implementing the User Interface. I did not have a hand in the design or the information architecture. I tried desperately to make it as usable and accessible as possible within the constraints of a pre-existing design.

During the QA process I must have squashed on the order of 150 bugs...almost half of the bugs reported for the entire project. (There's a long story behind that, which basically can be summed up as me coming on board the project as a johnny-come-lately. If I'd been involved from the start, there wouldn't have been nearly so many bugs.)

Project release:

The new website for the Denver Art Museum.

We wanted to do semantic markup, and have everything accessible. The folks at the Denver Art Museum wanted that too. Unfortunately, because of time constraints and the complexity of the design and information architecture we had to make some compromises. We also were not able to put up some content; the Explore Art section is still under construction and will be launched August 15.

The good news is we will be revisiting the site in the next few months and redoing it with completely semantic markup and complete separation of presentation, content, and functionality. I intend to ask the powers-that-be if I could take the lead on that particular charge.

In the meantime, enjoy.