Archive for ‘Web Design’
Apr
Castor
TAXI‘s latest launch is for Castor, a Canadian design company that specializes in some pretty unique furniture. I didn’t personally have the pleasure of working on this project, but I watched many of my fellow coworkers work on this over the last few months. The result is a beautifully designed website with an extremely rich user experience. It speaks to Castor’s eclectic designs and gives insight to their inspirations and inner workings.
In order to achieve the level of detail that can be seen on the site, a GigaPan was used to capture a series of images at amazing quality, which were then stitched together to see the image you see on the site. The shelving unit contains items that the Castor founders, Kei Ng and Brian Richer, draw inspirations from. Hidden among these items are menu items that give more insight to the company and the products they sell. Easter eggs are also hidden among the items to provide an fun and engaging way for the user to interact with the site.
The beauty doesn’t stop there; the mobile experience is just as impressive. Rather than taking the website and simply shrinking it down to fit a mobile device, the experience was blown up instead. Using an iPhone or an iPad, users can actually navigate a life-sized shelf with the built in accelerometer capabilities. Imagine looking through your device as if it were a window to this shelf, and to look around the shelf, all you’d have to do is move around (just like in real life!)
I personally enjoy the iPad experience a lot more than the iPhone. It provides a bigger viewing area, allowing you to see more of the shelf and more context. However, I do encourage you to try out both if you can!
Great job to the team of people that worked on this project, you really deserve it.
Mar
YSDN Grad Show 2010 Website Launch
Over the past few months, my graduating class has been working very hard to prepare for the annual grad showcase. I was fortunate to have been chosen as the project manager for the web team and it has been such a great ride. Today was particularly special because things finally seem to really be coming together.
We have officially launched the event’s website: YSDN10 I am so proud of how well my team has worked together. Every one worked very diligently to help make this possible. We wanted to take advantage of the web as a way of interacting with the end user, rather than simply speaking to them. In past years, the event website was quite static in that users would most likely only visit once. We wanted to change that this year and we’ve implemented a number of strategies.
First, we’ve started a blog. Okay okay, so everyone’s got a blog these days, so what? Our blog serves as a way to document the process of creating our grad show, which is fitting since this year’s theme focuses around the process of design. We want to allow users to get a glimpse into the work we’ve put in, because let’s face it, putting on a show of this magnitude is not easy. The second feature of the site, and probably the pride and joy of the web team’s efforts, is the filtering system within the gallery. This filtering system allows users to decide for themselves how they want to see our work.
The show will take place at the Fermenting Cellar at the Distillery District in Toronto from April 18 – 21. If you happen to be in town, please make sure to drop by and have a look!
Jan
GO Transit Website Redesign
GO Transit, Ontario’s only inter-regional transit system, launched the redesign of their website. Their previous design, shown in the thumbnail above, had more or less been the same since September 2007, and even then it was just a step behind.
My first impression of the redesign was quite positive. I was happy to see that the site was visually much more pleasing and that someone had taken the time to give it a fresh look. It makes excellent use of the space that is offered by modern resolution sizes and very great use of white space. A grid was now set up, where there wasn’t one before, and they ditched the table-based coding for the box model. Big plus.
The home page is much more organized now. There is a definite sense of hierarchy has been established and certain elements are given prominence. A carousel has been created using jQuery to cycle information that GO wants its users to see and buttons have been created for the three things riders care most about: service status, fares, and schedules. Below this, is secondary information that the user may or may nor care about.
The global navigation utilizes an unordered list, but I wish each link had a specified height and width so that functionality would be better. The secondary navigation pulls out in a drop down on hover then proceeds to animate to the next item as your mouse moves from one link to another. Now I’m not a huge fan of drop-down sub navigation to begin with, but if done correctly I don’t mind it. The animation on this one annoyed me quite a bit and I found it to be very unnecessary.
A large number of the static content pages make use of an accordion effect to relay the information. I like that this helps to break down the information-heavy content, making it more inviting. It would have been nicer to have the functionality to close each accordion by clicking the title again, rather than having to scroll my way to the next section (kind of defeats the point doesn’t it?)
One aspect that I am greatly disappointed in is the schedule system that is available to the riders. This is the same organization that had been available on the previous version of the site. Ever since I began my classes at Sheridan, I became an infrequent GO rider. Being infrequent meant I was constantly checking the schedules to make sure of the arrival times of my bus. I remember the very first time I came across this system, I was so puzzled by it. It took quite some time to navigate and figure out how to find the schedule for the right bus.
The first option is to choose from a list of GO schedules. This displays a list of schedules, but these schedules are not by bus route number, as most transit systems will do. This, on the other hand, displays a list of schedules that they have come up with based on destination (Buses often pass through same locations, but have different routes). Clicking on a schedule will bring you to another list, asking you to choose the day that you are riding and the direction you are traveling. This will then pull up a schedule (with several bus routes all in one). Also, for some reason, this schedule breaks the layout (it did this in the previous version as well).
The second option available is to choose from the weekday quick tables. There are four locations that are most frequented by the GO buses: Square One, Union Station, York University, and Pearson International Airport. Clicking one of these will bring you to a page where you can view PDF versions of the quick tables (which are business-card sized tables with arrival/departure times).
The last option, the one I use most, is the schedule finder. This had taken me ages to figure out on my own, which was not a pleasant experience. If you’ve never used it, try it out and tell me what your experience was. I’d be very interested to hear about it! There are several drop down options that you have to select through (these fields change depending on previous answers, so I realized you have to answer them in order for the finder to operate at its best). After finally figuring out how to answer all the fields, you get the aforementioned schedule from the first option.
I really wish they would have taken the time to rethink the information architecture of their schedules. Not only are they difficult to understand for a first-time rider, it creates a frustration that they do not need. (GO has a reputation for having too many delays and late bus/trains)
That’s my take on the redesign, your thoughts?
Dec
Cornerstone Architecture
Over the summer, I spent some time interning at Honey Design, a marketing and design firm in London, Ontario. While I was only there for a short amount of time, I was able to gain some of the real world experience that can’t be taught in a classroom. The ladies at Honey were so wonderful and taught me so many things. During my time there, I was fortunate enough to be able to work on several projects both print and web. Although I was not able to see any of the projects to the finish (because limited amount of time), it was very interesting to see the progress and work flow at different stages.
One of the projects I worked on was a website for Cornerstone Architecture. This architecture firm is unique in the way it approaches the brainstorming process. One of their methods is to sit down with the clients in a brainstorming session. During this session, rectangular pieces of paper are physically arranged on a blueprint to see what works best (as opposed to simply sketching on paper). This allows for a number of different configurations to be easily created. When one of the configurations looks good, they photograph it for reference and continue on looking at more.
I created a preliminary site mockup using this brainstorming method as inspiration. The final design is slightly different, but the essence is still there. It is meant to bring across the fluidity and movement of their brainstorming process as well as the appearance of a simple blueprint.
My old art director at Honey emailed me recently to tell me that the site was selected to be featured on Canada’s Web50. While the site isn’t actually mine, and the design has changed since the original concept, I’m so excited to see it featured! I was so blessed to be given the opportunity to work at Honey and I learned so much. Thanks!