So much of our work is translating designs from tools like Figma, into code. We've been doing it for the entirety of our career, so we began to explore what blurring the lines between the two practices would look like.

The benefits of being a designer and developer means that nothing is out of reach. Being able to execute an idea all the way through is a powerful feeling.

Figma is just a website at the end of the day, which to us as developers, means we can do anything we want with it. Thanks to the Figma plugin API, we can build tools that extend it's functionality. In our case, we can build a tool that converts the designs created in Figma into functional code that we can use on a site or app.

Using Svelte for the interface, Superfun will convert your designs in actionable components in React, Svelte and Vue with all the styles needed in traditional CSS and TailwindCSS.

For a while, Figma explored the same concept with their dev mode (which we love), but alternatives should exist for those who can't afford a dev license.

Go forth and create!

Being asked by Office Bureau to collaborate on a site for a publication devoted to design was like a dream come true.

The team was looking to explore an immersive experience that drew users in. The goal was to create a 3D style experience that explored dimension.

Initially exploring how we could acheive the effect through ThreeJS (3D Tooling), we settled on using SVGs and Greensock to manage interactions and animations. Not only did this allow us to create reusable templates that maintained an expected experience, but gave a smaller footprint for users.

To manage the content, we took advantage of an already existing WordPress instance and pulled the data through GraphQL to populate our NextJS pages.

The pride we feel from the work we've done on this site comes directly from the incredible projects of the nominees. We're honoured to be a small part of celebrating creativity and beauty in our world.

React Native mobile app created for Wahi. Wahi was created as a platform that would provide transparency and assistance for individuals interested in buying or selling a home in the GTA.

Shopify Hydrogen is a library that Shopify offers to developers in order to interact with the Shopify platform easily from code. The goal is to help theme developers grow the Shopify theme ecosystem with confidence.

To promote the library, Shopify hired Half Helix, who in turn, hired me to build a stunning landing page that explored web development potential.

Using Svelte to ensure a small footprint and promote reuse of code, we delivered a highly interactive marketing site in only 3 weeks.

Leveraging TailwindCSS to create a consistent experience from design to code, we were able to nail the design work with little effort and focus on the meatier tasks. All the while, taking advantage of the utility nature of Tailwind and sending a small amount of CSS to the users browser.

One key feature of the site, was the use of transparent videos to ensure a consistent brand experience across viewports. At the time, transparent videos were just becoming supported across browsers. Continuing the message of exploration, we worked hard to find the right codec, file size and format to ensure the videos communicated the message appropriately.

A jewel in our portfolio, being asked to solve design problems with code is one of the reasons why we do what we do. More please.

Like all good millenials, we've been forced to live in a world where all the housing is either expensive, falling apart or comes with a landlord who doesn't know the law.

After a few leaky roof situations, we decided to use our skills in design and development to build a platform that would allow users to review their rental experiences in the hope of helping others avoid a negative experience.

Using NextJS, PostgresQL and Tailwind, we built a full platform that allowed users to anonymously review their experiences with living situations. Everything from pets, mice, price of utilities and noisy neighbours was available to be documented for others.

Our goal was to flip the power dynamic that exists with renting, from being simply a renter, to being a consumer who makes smart decisions with their money.

Despite never gaining enough traction to change the world, the amount of learning we got from our experience working on this, is more than enough of a reward.

I led the development team in developing the performant, testable, and accessible product features that would make our product a success. I mentored my team members on their career development and reviewed code for the entire dev team. I worked closely with the product management team to plan, schedule, and execute new features against the KPIs.

I specialized in developing a Web-focused dev-run model that allowed my team to move nimbly through feature and support work. We increased accessibility compliance of features to meet AA requirements and a 100 Lighthouse score.

At Playground, I was responsible for managing the implementation of our product roadmap, including helping the client and the team build trust through open communication, supporting the needs of both clients and employees.

I'm passionate about building products that people love to use. I believe in creating an environment where everyone can thrive by sharing knowledge, creating opportunities for mentorship and growth, fostering collaboration across disciplines, building trust through open communication.

At Playground, I developed estimates and technical architecture documents for proposals and implementation as well as contributed and planned product roadmaps with product owners, client partners and discipline leads.

In weekly 1:1s with reports, I coached towards actionable goals and fostered a work environment based on knowledge sharing and opportunities for mentorship. I introduced continuous integration infrastructure, tools and systems to enable contributors to test releases

Focused on supporting development and product teams by using my knack for building high-quality solutions to complex problems.

I have experience in both back-end development and front-end development, with a focus on web and mobile projects. I love collaborating with product managers to build delivery roadmaps that fit budget, timeline, and product requirements. I also love mentoring the people who work under me so they can learn from me and achieve their own professional goals.

When it comes to technical solutions, I focused on everything from code review practices to standard methodologies.

As a Senior Engineer, I was responsible for building and debugging clean, web standards-compliant code and server-side technologies. I worked with creative disciplines to integrate my work into the final product.

I translated comps and wireframes into semantically correct web templates with support for cross-browser/platform compatibility. I collaborated with disciplines and project leadership to plan and execute AA level accessible experiences that carried out standard methodologies for load-time and platform usage.

I mentored team members through pair programming and code review exercises. I developed systems for implementing coding methodologies on projects based on client and system architecture needs.

I led nine-week development bootcamp and created course content. I mentored students during project work-time, providing code review and recommendations for best practices and optimizations. My content included HTML/CSS best practices, JavaScript and programming principles, and development tools such as Git.

I mentored new instructors on approaches for content delivery and opportunities to modify content for easier consumption. I provided career advice and leadership for students moving into the technical industry.