Website redesign for a Canadian manufacturer and distributor of high quality orthopedic products. The client originally had a landing page that was terribly outdated. They wanted to revamp the website and expand it to meet several needs. I took on the project in march 2019 and completed it with a month.
VIEW LIVE SITE
This brand is fresh, young and affordable. I picked colors that are inviting and fun, and drew some whimsical illustrations to add some personality. The UI had to be appealing for children and convey the idea that the courses at pufflang won’t be boring because they are designed for them. At the same time, it needed to be serious enough to gain the parent’s trust.
The logo doubles as a mascot that grabs attention. It might later be developped into an animated character should Pufflang become an app in the future. I experimented with hand sketches before moving on to digital ones. The version that was retained includes a puffin and conversation bubbles. Puffins are agile in all sorts of environements, which matches the misson of pufflang: make kids comfortable in many languages.
Le Poêlon Gourmand offers high quality service, yet their website presented many pitfalls when it came to information architecture. Unfortunately, many elements were reflecting negatively on the user experience such as confusing navigation, a lack of legibility, and many gray zones pertaining to the pricing and conditions and so on. I performed a website redesign that would address these points without changing the voice of the brand.
To achieve this, it was essential to clean up the information architecture as much as possible. Also it was necessary to guide users to easily perform these key tasks:
The Discovery Halts project was launched by the city of Montreal and other contributors to allow visitors to discover the Mount Royal Heritage site with fresh eyes. It consists of 3 types of elements; conical place-markers, halts where hikers enjoy beautiful views and 3D topographic maps of the site.
These are scattered about the park and intended to subtly draw attention to historical or geographical landmarks in a passive wayfinding approach. The place-markers especially, were designed to hint at these landmarks with their bronze inscriptions.
Developing a digital tool that would guide users just enough without stealing their attention away from their surroundings. The main challenge was bridging the gap between the intent of the elements in place and the understanding of the users to allow them to really benefit from the experience. We also needed to come up with discovery and way finding solutions that didn’t interfere with nature.
Among the methods used during the discovery phase were surveys on electronic devices, interviews conducted on location, and intercepting users near the place-markers.
As part of the Discovery Halts project developed by the city of Montreal, we conducted research and developed an app concept to enhance the project and achieve its original goal: bring people back to the trails of the Mount Royal and allow them to rediscover this place rich with history.
Affinity diagram with post-its to summarize and organize information gathered from the interviews.
“I come here once a year as a school field trip, but I never went in the paths”
“I don’t know; covered tree stumps?”
“I have been walking here every morning for 9 years and have never seen them.”
We concluded that while the place-markers provided hints to natural and historical facts present in Mount Royal, it was necessary to give people more explicit information so they would understand what they were looking at and not miss out on nuggets that could enhance their experience. So we set out with the aim to guide and inform users.
Before the final design was complete, we put ourselves in our users’ shoes to find out who would be using the product and how they might be introduced to it.
We designed a mobile app with two main sections:
Which allows users to plan their visit based on historical monuments, fauna and flora or lookouts they want to visit on the Mount Royal.
Which gamifies the experience by suggesting different hunts to look for clues and learn facts about the site while respecting user constraints (length, difficulty, time to complete).
Since this was a website redesign, I made a point to preserve their existing logo and main brand color. I also extended the color palette with warm hues to remind of a hearty and delicious meal. Added to these a dark charcoal to provide contrast and remind of the cast iron pans. Textures were also used to represent the different cuisines from all around the world and maintain visual interest by bringing a bit of lightheartedness to the information presented.
Self explanatory.
Just as a house may needs renovations, websites can require a thourough redesign. In the case of BMI, their customers were experiencing frustration navigating the site and as a result, they kept flooding my client with endless phone calls. They also had to deal with an interface that wasn't intuitive, such as clicking on a link that directly opened a PDF without warning them beforehand.
The main goal was to address all the recurring questions customers were asking and organize information they were looking for to reduce phone calls to a minimum. It was essential to create a simple and efficient design that would ensure a positive user experience.
The project started with a brainstorm session with the client to make sure I understood his vision. After which, I edited all the order forms and made them interactive for easy online fill in. From there, I drew wireframes, iterated on design decisions to best display the content and finally coded the website in HTML and CSS with JavaScript integrations. Then, I setup and interactive map to display sales representatives and arranged an user-friendly contact page.
A competition research revealed what was being done in that field and how my client could stand out. The team at BMI ortho is very tight knit and puts everyone that comes in contact with them at ease. They also offer tailored braces crafted directly on location. We allowed this to come front and center with some personal touches like some custom photography added to a virtual gallery.
You know you’ve done a good design not by if it’s “good looking” or not. But whether the user’s needs are met and their life is made easier by what you’ve made.
The first few weeks of this project I worked on location, but a good part of it was completed remotely with regular check-ins. I found it super convenient and I was just as efficient (if not more) as I would have been doing the commute.
01- InVision prototype which we later tested with real users on location.
02- 360 AR (augmented reality) we developed to allow visitors to travel through time and see what the location they’re standing in used to look like.
Many projects may seem vague or as having blurry edges. It’s our job as designers, especially in UX, to provide clarity for the user and to ensure they have a positive experience.
We started as a team of 6, but as the project moved forward, some team members didn’t see the purpose and dropped the project to pursue different avenues. They participated in some field research, interviews and early brainstorming. The remaining was a team of two; my classmate, Eliot Zeinaty, and myself. This meant restructuring our approach dramatically, and sacrificing certain aesthetic decisions to respect our tight deadline. We juggled with wire-framing, app design and prototyping to present a cohesive final presentation. In the end, I was responsible for the design of the entire “Treasure Hunt” section. I learned to prioritize like never before and to adapt to changing circumstances.
One of the families we interviewed spoke German. Now I now how to say “you’re welcome” in that language thanks to them. Connecting with the real people that might use your product in the future is amazing.
