Website Design and Development – PIRS Hackathon – Out-Smarts Case Study

Out-Smarts designed, developed and optimized a responsive one-page website that integrated to Eventbrite to promote registration for Pacific Immigrant Resources Society’s Innovation in Childcare Hackathon.


Pacific Immigrant Resources Society, approached us to work on a new and innovative project. This project was something that had never been done in their industry before – a social Hackathon. After evaluating proposals from several agencies, PIRS hired Out-Smarts, to design and build a fully responsive one-page site to support their Hackathon initiative.

This project had a modest budget and was initially set to have a tight turnaround with a little over a month from concept to creation. When they contacted us to see if they could launch a week early, we pulled out all the stops to make that happen.

About Pacific Immigrant Resources Society Hackathon

Pacific Immigrant Resource Society (PIRS), a non-profit organization, is hosting a social (non-tech) hackathon to come up with everyday solutions to real-life problems faced by immigrant women and their children. This is an incredible opportunity to get involved, give back, and collaboratively find better solutions to the ongoing childcare needs in our community. The Hackathon’s goal is to better meet the needs of young families across the Lower Mainland through this dynamic and innovative social enterprise initiative.

Website Design and Development

Out-Smarts excels at WordPress work, but sometimes a content-managed solution is excessive for the project at hand. In this case, PIRS had minimal content requirements for the site and — given the time-sensitive nature of the hackathon event — required few future content changes. These factors made a single-page, standalone site the best (and most cost-effective!) option for the non-profit.

We designed a bold but accessible look for the hackathon site using a few images PIRS provided us and a two-tone colour scheme based on the organization’s brand colours. The webpage itself was handwritten (rather typed!) in good old HTML and mobile-friendly, responsive CSS, two foundational tools of the web for structuring and styling content. Our use of subtle yet snappy transition states and slightly skewed design accents help to really convey the fun, modern sensibility PIRS intended for this government-funded project.

The Results

Pacific Immigrant Resource Society – Hackathon

PIRS needed a responsive, one-page website on a tight budget and turnaround time. We were able to give them a successful launch one week early, with a modern, upbeat, and simple user flow tailored to the updated version of the PIRS brand. By taking the time to get to know their values and intentions of the project, we could create a custom web design that reflects the innovation and optimism of the Hackathon.

In The Customer’s Words

“It is rare to find a caring multi-talented team like Out-Smarts. The feedback we’ve received has been incredibly positive. Out-Smarts delivered a site that stands out and showcases our Hackathon in the best light. Their team took the initiative to step up and help us to take this from concept to creation to launch in a little over a month and days ahead of schedule. Mhairi and Kyle truly showed that they cared about our organization.”

Why We Loved this Work

The PIRS Childcare Innovation Social Hack is such an incredible cause to bring attention to childcare solutions and can have a huge impact on immigrant women and their families. We’re proud to be a part of such an innovative cause to help our fellow Canadians and we are happy to be able to pull together to launch the site ahead of schedule.

Search Engine Optimization – Fairware Case Study

Out-Smarts worked with Fairware on search engine optimization through two redesigns, launching both new websites with no perceivable drop in traffic despite there being a complete revamp of the user flow, maintaining page one rank and growing traffic, with organic search rates up over 30%.


We began working with Fairware in 2015 to optimize their freshly redesigned website. In 2018, it was time for another website redesign, and they chose Out-Smarts again to optimize their new site.

About Fairware

Fairware is a pioneer in creating sustainable, custom branded products for businesses. These B Corp founders take great care to ensure your promotional merchandise helps tell your story and animate your brand. Fairware brings emerging retail, consumer and sustainability trends to the forefront of promotional campaigns and product assortments. They’re sustainable brand strategists and merchandise is their medium. Further, Fairware does the homework on ethical sourcing and sustainable materials so you can rest assured that your marketing merchandise lines up with your values.

Fairware website

SEO Services

With this project, it was crucial to optimize both website redesigns to maintain or improve their page rank and positioning given that the redesigned site would have a different user flow and navigation. To ensure this, we worked with Fairware on keyword research, keyword mapping, creation of keyword targeted META titles and descriptions, managing redirects, and identifying and fixing any crawl errors. We also provided extensive Google Analytics consulting services and developed custom dashboards and reports to measure SEO, social media, and email campaign impacts.

The Results

By implementing these strategies, we were able to produce significant results for Fairware and by creating Analytics dashboards and reports for them, they’re able to measure their efforts more effectively. Here is a snapshot of the results we produced.

Through both new website launches, there was no long term drop in web traffic. Fairware was not only able to maintain their page one rank, but they increased their positioning for priority keywords. Organic search rates went up over 30%. When it comes to first page rank for priority branded keywords and search terms, 29 keywords are now in the top ten Google rank for Canada and the US.

Results from the Latest Redesign

  • An overall increase in traffic 21% (in 6 months following redesign)
  • Increase in organic traffic 30%
  • 34% increase in search engine visibility
  • 29 priority Keywords in the top ten Google rank

In The Customer’s Words

“Fairware has worked with Out-Smarts on two projects so far: Search Engine Optimization for our website redesign and on developing an email marketing strategy. Traffic and conversions have increased, our business is growing and we’re very pleased with the results. Mhairi is a joy to work with and has been great at building our internal capacity so we can continue the work in house.”

Why We Loved this Work

At Out-Smarts, our priority is to work with clients that have mandates to make the world a better place. From their environmental impact to their B Corp status, to their ethical principles, it was a joy to work with and learn from Fairware, to understand their business and to provide search services to attract their target audience and improve their ranking. Through working with Fairware we believe we play a small part in helping disrupt and positively influence the promotional products sector.

Website Development, SEO, Consulting – Indalma Case Study

BackgroundIndalma Creative SEO

Out-Smarts worked with Indalma Creative collaboratively to develop a custom new WordPress website, complete with SEO and ongoing web maintenance.

About Indalma Creative

Indalma Creative is a Ladner-based graphic design and creative services studio with clients across BC and Canada. They help businesses big and small tell their stories through engaging brand identities and logo design, clean website design, persuasive content, beautiful print pieces and packaging. Indalma’s clients include local and national businesses, independent schools, and non-profit organizations such as health authorities and emergency services.


Indalma Creative wanted a brand new website overhaul that wasn’t just beautiful to look at, but was easy to navigate and search engine optimized as well. We wanted to make sure that they had all the tools in place to boost their agency the top of their niche in local Google searches.

In order to do this, we provided custom WordPress site development, SEO services (META review, keyword research and mapping, update SEO foundations and framework, crawl fixing), Google Analytics set up (traffic reporting, conversion tracking and analysis), and consulting services.

The Results

Indalma Creative is expanding, and they needed a website that suited the needs of their growing business. We created a custom web design with navigation and SEO capabilities to draw customers in and reflect their company values. The result was a successful site launch with a smooth workflow beginning to end, all due to hard work and a positive teamwork environment.

In The Customer’s Words

“Being our development partner, we knew we wanted to work with Mhairi and her team at Out-Smarts for our new website. We’ve seen first-hand the results she delivers for our clients which made this an easy choice! We couldn’t be happier with our new website. And, while the new site is exactly what we had hoped for, the process to get there was equally seamless. Mhairi and the entire Out-Smarts team made this project a fully collaborative process and let us be involved every step of the way.”

Why We Loved this Work

We love to work with companies that are leaders in their field with boundless ideas and striking attention to detail. We loved giving a creative powerhouse like Indalma a website that has a backend as intuitive and streamlined as their design capabilities.

Custom App Development – Pacific Forage Bag Supply Case-Study


Pacific Forage Bag Supply is an agricultural firm founded in 1995 that supplies silage equipment and seeds.  Co-owner Alexis sells specialized equipment to dairy farmers that helps them reduce feed loss from rot and spoilage. In the past, she’s relied on a helpful but outdated sales tool built in Excel to help her show farmers what they stand to gain from using the equipment. The tool did its job but was harder to use than it needed to be. Despite the essential information it provided her clients, the spreadsheet was becoming a hindrance to her sales process. Alexis approached Out-Smarts to explore the possibility of replacing the tool with a custom app.

Discovery Process

Alexis’ requirements were few: the tool needed to be easy to use, generate PDF reports she could download or print for her clients, including a defined subset of the functionality present in the Excel document, and be completed within her budget.

Because she often meets her clients on their farms and in rural areas without guaranteed internet access, we decided the tool should be a client-side, single page application that could be used offline. Since the app would generate PDF reports, we didn’t need to worry about permanent storage on a remote server or database access.

Our discovery process involved investigating the hundreds of formulas and macros built into the Excel document to get a clear picture of the work required to translate the calculations. Behind the scenes, the formulas were at times a classic case of spaghetti code: cells referring to cells referring to cells which in turn referred to yet more cells. Working with Alexis, we broke the spreadsheet down into its major screens and calculations. Then, we create a fully costed project summary for her, which she reviewed and approved.

Some of the formulas in the Excel document

React Web App Development

Initial design work was done in Figma — a design tool like Sketch.

After breaking down the excel document, we prototyped some interface layouts and visual styles in Figma, a design tool similar to Sketch. We worked with Alexis to map out the information architecture and user interface flows of the new tool. The goal wasn’t simply to recreate the Excel document screen-for-screen, but to design a workflow that would best support her whole sales process. By using modern web technologies and rebuilding the tool for the browser, Out-Smarts was able to deliver a user experience much improved over the Excel document.

We chose React, a JavaScript library for building user interfaces, because it supported our requirements of an offline, client-side, single page experience. And it’s popular; backed by Facebook, React is unlikely to disappear anytime soon.

We also used a few other well-supported open source libraries to deliver features like PDF file generation and animated charts: Webpack and Babel formed the foundation of our development toolchain; Redux and Dot Prop Immutable allowed us to store client-side data in a simple but flexible format; Big.js prevented unfortunate rounding errors in calculating monetary values; PdfMake generated PDF reports without the need for server software; and Victory gave us animated charts and graphs to display in-app reports.

Single-Page Application

The result was an offline-ready single-page application with 14 sections that used over 35 custom-built React components. We replicated the computations of the original Excel document with over 60 calculation functions, this time in an exceptionally user-friendly and portable solution.

Right from the browser, Alexis can export PDF reports for her clients based on the information she gathers during her discovery process. And she can even export and import client profiles as JSON files to share among her employees who also have access to the tool.

What Our Customers Have to Say

“I had a very old Excel-based sales tool that I needed updating, and I had a hard time finding someone who would take it on that I felt I could communicate with throughout the process just to ensure we were on the same page.  Out-Smarts Marketing was recommended to me by someone in the Marketing field, which I thought was a good sign. Kyle took on my outdated sales tool, with all it’s convoluted and confusing equations, and listened and learned about my Agriculture business and my needs.  His attention to detail and his comfort with the material made the plan very effective and surprisingly simple (at least from my end)! I am very happy with the final product and know it will serve my company well.”

Why We Loved this Work

Having a great working relationship with our clients really is the foundation to any project’s success, and Alexis was a joy to work with. We enjoyed learning more about her industry and the challenges she faces in the field, as her explanations gave us a great sense of how she uses the tool and the value a modernized version would add to her work life.

Building a React application after an Excel document may have been an unconventional task, but we love a challenge and the opportunity to do custom work that few others take on. We’re thrilled with the results!

Learn more about our custom app services or get started on your own custom developed app.