Effective, custom web design and development for nonprofits.
Effective, custom web design and development for nonprofits.
Mike's technical expertise, design acumen and insights for how to optimize the user experience are superb. We received an enthusiastic response from users of the site in our post-launch surveys. Mike would be the first person I'd call for another project.
Barbara Szijarto, Canadian Paediatric Society
The Canadian Paediatric Society hired me to design and build the website Caring for Kids New to Canada, a site that helps health professionals provide quality care to immigrant and refugee children, youth and families. The site was a Web-version of a book that the Canadian Paediatric Society had published, and involved many editors and contributors. The site was to run on an existing install of the CMS ExpressionEngine, which powered other Canadian Paediatric Society Web properties.
For the Caring for Kids New to Canada project, I put together some mood boards to establish a direction for the personality of the site. In the discovery phase of the project, we came up with a list of adjectives that should describe the site to visitors. The most important were friendly, helpful, professional, and authoritative. I then created a collage of screenshots of other websites from around the Web that also exhibit those characteristics, focusing on the design elements that accomplished this.
The next step in the process was to create some wireframes: simple, gray-box layouts that show where on the screen the content might go. This exercise helps everyone to focus on placement of content without being distracted by the visual design. There were several elements that needed to appear on the homepage, so I created wireframes to represent various layout options.
Once a personality was established for the site, we needed to create its brand identity. I subcontracted a graphic designer colleague of mine to design some logo concepts, and once we settled on one, I developed a colour palette and various design elements based on the logo.
Attention to detail is very important to me, and I wanted to illustrate this on the Caring for Kids New to Canada project. To mirror the three circle "heads" in the site logo, I used three coloured ellipses as the control buttons for the sliding image carousel. I added some coloured flourishes to the corners of the carousel images as well. In the "Featured Content" sidebar, the heading of each entry is indented slightly, and I added partial circle cut-outs in the surrounding frame, again reinforcing the ellipses from the logo. The end result is a cohesive brand that is recognizable throughout the site.
As part of the Caring or Kids New to Canada project, the Canadian Paediatric Society asked me to build a Signs and Symptoms search feature that would allow medical professionals to identify their patients' symptoms and find a list of possible diseases and conditions that match them.
Content authors can add the details about each disease into the CMS and tag them with the appropriate symptoms by assigning categories. Visitors to the site can select symptoms from the list, hit Seach, and get a list of matching diseases and conditions. The search tool allows the user to indicate whether he wants results that match all symptoms or any, and groups results by severity.
Rather than use simple checkboxes for the symptoms list, I wanted to present the visitor with large target areas to make them easy to select, especially on mobile devices. When a symptom is selected, the entire box surrounding it turns green and stays that way even after the results are shown to remind the user which ones were selected when the search was performed.
The Caring for Kids New to Canada site is content-rich, and since its target audience is medical professionals with busy schedules, pages need to be accessible quickly. To this end, I built "mega-menus" to house the navigation. Hovering over each primary navigation item causes a fly-out submenu to display showing a list of pages in that section, along with an image to help with visual recognition.
Caring for Kids New to Canada is built with responsive design and is optimized for desktops, tablets and smartphones. The site is available in English and French using a page-sensitive language selector so that when switching languages, the user sees the translated version of the current page rather than being sent back to the Home page. The domain also responds to the language preference: "KidsNewToCanada.ca" for English and "EnfantsNeoCanadiens.ca" for French.
After its launch, the Caring for Kids New to Canada website was featured on the Canadian television program CTV News.
The following are some comments about Caring for Kids New to Canada submitted by members of the target audience post-launch:
I am just writing to tell you how absolutely thrilled I am to have been forwarded your new website. You have done a beautiful job of presenting information in useable format and language. Thank you so much for putting together such an incredible resource.
I LOVE it!!! I will insist that all medical students and residents who complete electives at our clinic use this website.
Very beautiful, easy to use, inviting to use. Great links. Working really well and easy. Great job.
Excellent. Extremely clear. A great addition to the CPS tools. Very good for residents, sufficiently in depth but with additional resources available. More clear than many online tools I have used before. I will use it to teach students.
Excellent resource which I will definitely access in my day to day practice.
Like what I did with Caring for Kids New to Canada? Get in touch and let's talk about what I can do for you.