<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Background</h4>
</div>
<p>In fall of 2021, the decision was made to modernize the membership process of Homenetmen Toronto. Up to this point, there wasn&#8217;t even a website to build off of, and everything would need to be designed and developed from scratch. Many options were considered, including out-of-the-box solutions like Squarespace, Square and even some specialized options like PowerUp. We concluded that a custom solution was required.</p>
</div>
<div class="elementor-element elementor-element-1d149e2 elementor-widget elementor-widget-text-editor" data-id="1d149e2" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Project</h4>
</div>
</div>
<div class="elementor-element elementor-element-1a9ed5f elementor-widget elementor-widget-text-editor" data-id="1a9ed5f" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>We set off with designing an infrastructure that consisted of a public-facing website, an admin site, a headless CMS powered by WordPress and a Node.js API middleware that would handle auth and db calls for both front-end applications. For storage and authentication, Firebase was chosen for speed of development and cost restrictions.</p>
<p>&nbsp;</p>
<p>Next.js was used to build the public-facing and admin sites, paired with TailwindCSS for quick styling. For the membership system, a custom solution was built leveraging Bambora&#8217;s forms and APIs for payments, Firebase for data storage and user accounts, and Sendgrid for communications. All dynamic content for the site comes from a headless instance of WordPress, with it&#8217;s own auth and membership system to manage executive/leadership access. The sites and API were hosted with Vercel.</p>
<p>&nbsp;</p>
<h4 class="elementor-heading-title elementor-size-default">Results</h4>
</div>
<p>In its first year of operation, the site processed over $48,000 CAD in membership payments, with over 440 members registering. The project was lauded as a massive success, setting a record for registrations and modernizing a severely outdated process, allowing for efficient auditing and management.</p>
</div>
</div>
<p>&nbsp;</p>
</div>
</div>
</div>
</div>
</div>
</div>


Homenetmen Toronto

Role

What

Where

When

Next.js, React, Node.js, Firebase, Sendgrid, Vercel, Bambora, Headless Wordpress

<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Project</h4>
</div>
</div>
<div class="elementor-element elementor-element-1a9ed5f elementor-widget elementor-widget-text-editor" data-id="1a9ed5f" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>The problem that was set to solve for Hallajian &amp; Associates Financial Services was the lack of a simple and branded way to send out quote forms to their clients. The solution was LeadsCenter, which allowed the creation of leads, sending through email or SMS and the collection and  storage of lead data in an easy to use portal.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>


LeadsCenter

Hallajian & Associates Financial Services

Next.js, React, Node.js, Firebase, Twillio

<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Problem</h4>
</div>
</div>
<div class="elementor-element elementor-element-1d149e2 elementor-widget elementor-widget-text-editor" data-id="1d149e2" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>Digital ID was built to fit a gap in the jewelry industry left by antiquated inventory management practises that we’re not only wasting time and resources, but had also opened up businesses to theft and inventory loss. The general premise was to eliminate the need for physical tags and identifiers on jewelry products. Physical solutions such as these not only take away from aesthetic value of pieces within showcases, but are also very easily misplaced and incorrectly identified.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Solution</h4>
</div>
</div>
<div class="elementor-element elementor-element-1a9ed5f elementor-widget elementor-widget-text-editor" data-id="1a9ed5f" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>After approaching the problem from many different angles, the conclusion we came to was that the best method of identification would be to have the jewelry be its own identifier. We began testing and we quickly had a working machine learning model that could reliably identify jewelry pieces and bring up their information within a custom built mobile application. The process for business’ wanting to implement the solution was simple: We would use an in-house built, proprietary device to collect the training data and train a custom model specific to the business’ needs. From there the model could be deployed to a custom mobile application to be used on a variety of devices by end users. Inventory data would be collected and stored on secure servers accessible by clients on a web app. As needed by clients we could also integrate the solution with their existing POS systems to reconcile inventory numbers with sales data.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-8c997df elementor-widget elementor-widget-heading" data-id="8c997df" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Technical Details</h4>
</div>
</div>
<div class="elementor-element elementor-element-26a6f5b elementor-widget elementor-widget-text-editor" data-id="26a6f5b" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>Multiple technologies were considered and we found that a combination of different ML models worked best, depending on the clients needs and complexity of their inventory. Most demos were sufficiently served by a combination of CoreML based classification and object detection models, while more complex projects required the use of custom built proprietary model technologies.</p>
<p>&nbsp;</p>
<p>For the front end client side applications, different technologies were used depending on the platform.</p>
<p>&nbsp;</p>
<ul>
<li>The web app was built using Node.js, React and MongoDB.</li>
<li>The native iOS app was built purely using Apple’s Swift programming language.</li>
<li>The native Android app was built using React Native.</li>
</ul>
</div>
</div>
</div>


NOIARK Digital ID

<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Background</h4>
</div>
</div>
<div class="elementor-element elementor-element-1d149e2 elementor-widget elementor-widget-text-editor" data-id="1d149e2" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>The idea behind World of Jewelry was to create an online marketplace that would allow the business owners to leverage their existing connections within the jewelry industry supply chain. The marketplace would combine inventory held by the company as well as a vast catalogue of jewelry from third parties that would drop ship products directly to customers.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Project</h4>
</div>
</div>
<div class="elementor-element elementor-element-1a9ed5f elementor-widget elementor-widget-text-editor" data-id="1a9ed5f" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>The project started with the branding. World of Jewelry’s logo was designed to convey the company’s mantra “We shop the world for you” and features a diamond shaped globe set above a simple and classical combination of typefaces. The website was designed with the customer experience in mind. Upon loading, customers are met with large bold imagery with navigation elements and branding blending seamlessly and a non-intrusive cart drawer that allows for viewing what’s been added so far without ever leaving the page.</p>
<p>&nbsp;</p>
<p>Social media accounts on Facebook, Instagram and Pinterest were set up for the company as well as ad accounts deeply integrated with the website to allow for effective data collection for marketing.</p>
<p>&nbsp;</p>
<p>The main challenge of the project was to build an inventory management system that could handle orders containing products from multiple different warehouses in different countries. This was solved using a combination of Shopify extensions and automation tools that allowed orders to be split for fulfillment with in house inventory being managed through the Shopify and externally managed inventory being sent out as automated emails to suppliers containing automatically generated packing lists and shipping information.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>


World of Jewelry

<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Background</h4>
</div>
</div>
<div class="elementor-element elementor-element-1d149e2 elementor-widget elementor-widget-text-editor" data-id="1d149e2" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>Through contact established on a trip to Sweden in 2016, the opportunity to update the branding, website and marketing of this local sushi shop in Gävle, Sweden.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Project</h4>
</div>
</div>
<div class="elementor-element elementor-element-1a9ed5f elementor-widget elementor-widget-text-editor" data-id="1a9ed5f" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>&nbsp;</p>
<p>To begin, we updated the brand assets to bring them in line with modern standards, including the logo, signage and menus. We also worked with a local POS and e-commerce company to integrate an online ordering solution into their updated website built on the WordPress platform. Once launched we set up their social media accounts and prepared a content schedule that the company could use moving forward.</p>
</div>
</div>
</div>
</div>
</div>


Sushibaren Gävle

Graphic & Web Design, Social Media Management

<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<div class="elementor-element elementor-element-1dcf0a4 elementor-widget elementor-widget-heading" data-id="1dcf0a4" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Problem</h4>
</div>
</div>
<div class="elementor-element elementor-element-1d149e2 elementor-widget elementor-widget-text-editor" data-id="1d149e2" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>A major part of developing computer vision machine learning models is annotating the training data. This process is usually done by using software to draw bounding boxes around an object in an image, and subsequently tagging the bounding box with the object’s identifier. For larger datasets, such as the ones worked on at NOIARK, this process became extremely cumbersome and was cutting into development time.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-add954d elementor-widget elementor-widget-heading" data-id="add954d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Solution</h4>
</div>
</div>
<div class="elementor-element elementor-element-1a9ed5f elementor-widget elementor-widget-text-editor" data-id="1a9ed5f" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>A proposed solution was to outsource the annotation work. This works fine, but doesn’t help with deadlines as there is still a waiting period for the work to be finished, or an increased cost to have it finished faster. This is where AOTT comes in. Essentially eliminating the process of drawing bounding boxes, it cuts out the most time consuming part of the process. The way this is done is through using a much more basic version of the ML model we were developing. The model would identify the object in the image and draw the bounding box around it, handling hundreds of images within minutes instead of hours.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-8c997df elementor-widget elementor-widget-heading" data-id="8c997df" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Technical Details</h4>
</div>
</div>
<div class="elementor-element elementor-element-26a6f5b elementor-widget elementor-widget-text-editor" data-id="26a6f5b" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix">
<p>The app was built for macOS purely on Swift and worked with both CoreML and tensorflow based models. One of the key features of the app is it’s ability to process video files over just large sets of images. This streamlined the data collection process as well as allowing the user to select the number of training images to create.</p>
<p>Using the app is extremely simple, the user provides the base ML model to work off of, the video file and specifies the framerate as well as the object identifier. The app then takes over and processes the video, outputting a folder of JPGs to use as training images, as well as a CSV file containing the bounding box information.</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<div class="elementor-element elementor-element-15d8149 elementor-widget elementor-widget-heading" data-id="15d8149" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h4 class="elementor-heading-title elementor-size-default">Demo</h4>
</div>
</div>
<div class="elementor-element elementor-element-25e6d6f elementor-widget elementor-widget-spacer" data-id="25e6d6f" data-element_type="widget" data-widget_type="spacer.default">
<div class="elementor-widget-container">
<div class="elementor-spacer">
<div class="elementor-spacer-inner"></div>
</div>
</div>
</div>
<div class="elementor-element elementor-element-705ea59 elementor-aspect-ratio-11 elementor-widget elementor-widget-video" data-id="705ea59" data-element_type="widget" data-settings="{&quot;video_type&quot;:&quot;hosted&quot;,&quot;autoplay&quot;:&quot;yes&quot;,&quot;play_on_mobile&quot;:&quot;yes&quot;,&quot;mute&quot;:&quot;yes&quot;,&quot;loop&quot;:&quot;yes&quot;,&quot;aspect_ratio&quot;:&quot;11&quot;}" data-widget_type="video.default">
<div class="elementor-widget-container">
<div class="e-hosted-video elementor-wrapper elementor-fit-aspect-ratio elementor-open-inline">
<p><video src="http://cms.arthurboyadjian.com/wp-content/uploads/2022/11/056e6552-f2f4-45a5-8f7e-73364b9e360e-1.mov" autoplay="autoplay" loop="loop" muted="" width="450px" height="auto">056e6552-f2f4-45a5-8f7e-73364b9e360e (1)</p>
<div class="elementor-element elementor-element-435b396 elementor-widget elementor-widget-spacer" data-id="435b396" data-element_type="widget" data-widget_type="spacer.default">
<div class="elementor-widget-container">
<div class="elementor-spacer"></div>
</div>
</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p></video></p>
</div>
</div>
</div>
</div>
</div>


Portfolio