A reflection on the numerous hats I’ve worn during nearly 7 years at ProSource.
It’s hard to believe I’ve worked full-time at ProSource nearly 7 years now. It’s virtually impossible to distill everything I’ve done into a single post, but I’ve done my best to break up the roles I’ve played into several broad categories.
Product & Web Design
In October of 2020, my role was changed to Product Designer. This more closely aligned with the type of work I was doing and would continue doing. In 2021, I spent the majority of my time on the company rebrand and redesigning our main marketing website.
The rebrand effort had so many tentacles into other areas, including but not limited to:
- Brand and brand guidelines
- Collateral, including business cards
- Branding of tools and platforms
- Email templates
Since mid-2022, I’ve been working on our company’s design system, affectionately referred to as Mettle. This has helped me maintain visual consistency across our platforms and provide structured — but not rigid — guidelines to dream up new designs.
Case Studies & Projects
Below is a collection of case studies and projects I’ve completed at ProSource:
An ecclectic selection of various UI bits I’ve designed over the years:
ProSource Website — Menu Prototype
ProSource Landing Pages — HIPAA Quiz
ProSource Invoice Email Templates 2023
ProSource — Landing Page Concept 01
ProSource Website — Video Library Concept 01
Mettle Design System — Color Tokens
ProSource Website — Blog Concept 01
ProSource Service Ticket Email Templates 2023
I manage all of our company’s web properties and email templates. Currently, we have 5 websites deployed, including a handful of landing pages and our main marketing website.
Before I took over development, we used a boilerplate WordPress template for our site. It was clunky and boring.
When I took over front-end development, I moved our sites over to a framework called Astro. Astro is a JAMstack framework (for lack of better term) that prioritizes developer experience and performance. I started using this tool early in its beta days and have enjoyed watching it blossom into what it is today.
For styling, I use Tailwind CSS because it allows me to iterate designs extremely fast. I can use the same Tailwind config file from our design system and keep it in sync across all of our web projects.
All of our sites are deployed on Netlify. I use Netlify’s branch feature to A/B test and preview changes before pushing to production. Lately, I’ve added Cloudflare Images to our stack. It’s an extremely affordable image CDN that keeps our GitHub repositories free of heavy image files. It’s not quite as feature-rich as Cloudinary, but it’s been well worth its monthly price.
All of our email templates are created in Maizzle. Before this, I had given MJML a shot but quickly migrated to Maizzle once I discovered it.
For starters, Maizzle uses Tailwind CSS under the hood — allowing me to draw upon the same Tailwind config file for web projects. Secondly, I found in my testing that MJML didn’t spit out HTML that rendered properly in Outlook on Windows. The Windows Outlook client is notorious for being the worst when it comes to supported HTML/CSS features. In my experience, I found that Maizzle’s output was much better.
Brand & Visual Design
In 2021, our company underwent the largest rebrand since its founding in 2006. This rebrand signified an important milestone for our company. 2021 was the year we celebrated the company’s 15 year anniversary and it also visually represented a refocusing of efforts to a narrower audience and portfolio of services.
I helped shape our new brand. I worked with an independent designer on the logo, going back and forth on ideas and sketches until we landed on a final design. I chose our company’s color palette, typeface, and created brand and content guidelines.
Today, these brand assets are maintained and documented in our design system, Mettle. I also keep an Adobe Creative Cloud library published with our colors and brand/logomarks. This allows others on our team to access our palette and visuals when making assets in Adobe Express; and, it helps me stay in sync when I’m working in other Adobe tools like Photoshop, Premiere, and InDesign.
I also designed the majority of our company’s collateral, including sales and marketing materials, customer guides, and our company business cards. Whenever possible, I brand our customer-facing tools to maintain visual consistency and familiarity for our customers.
A few years ago, our Business Development team migrated to HubSpot. This platform has been a huge boon for us. It’s helped us gather multiple customer and prospect channels into one place. It helps us manage our website’s live chat, social media channels, email campaigns, and website analytics. I help the Business Development Director craft and/or edit email and social media campaigns in HubSpot.
I’ve been immensely involved in monitoring our analytics and website traffic. I am always tinkering with the marketing copy, position of elements on web pages, and technical search engine optimization (SEO) to increase conversions.
Much of the copy on our landing pages was written by me, so I was surprised to learn that these pages average a near 10% conversion rate. For comparison, the industry average is anywhere from 2–6%. That percentage is probably even lower for the tech industry. Typically, the sales cycles are long and drawn out in tech, with many touches required to close deals.
I’ve written many internal and customer-facing technical documents. I’ve also contributed thousands — yes, thousands — of edits to the company knowledge base. Below are a handful of the types of documents I would produce:
- Dozens of Standard Operating Procedures (SOPs), internal processes, and standards. Lately, I’ve been documenting processes in Loom.
- Dozens of Statements of Work, which I attached to sales quotes for IT projects.
- A handy onboarding guide for radiologists that would be receiving read-from-home equipment. This guide includes an equipment list (monitors, peripherals, etc.), an onboarding process, our support information, and a few handy desk set up diagrams in case they needed to set their workstations back up.
In my IT Coordinator days, I often performed project manager duties. Over this 4 year period, I personally managed more than 80 IT projects. Many of these projects required Statements of Work (SOWs), and I wrote a good chunk of these.
Quoting & Sales
As the IT Coordinator, I was responsible for quoting one-off hardware/software purchases and IT projects. In a 2 year period, I handled over $500,000 in gross sales. Additionally, I worked with our Business Development Director to widen our profit margins by 20+% through upselling and fostering mutually beneficial vendor relationships.
Workflow & Process Improvement
If there is a process, workflow, or tool we use that I can improve, I do. From complex user onboarding processes to the craziest Power Automate flows in SharePoint, I’ve done it all.
Below are just a handful of the processes, workflows, and tools I’ve impacted:
- The organization of our company’s knowledge base, in a tool called IT Glue.
- A multi-factor authentication (MFA) form that used IT Glue’s REST API to automatically send data to our KB in a consistent format.
- A Time Off Request form and approval workflow, built using a SharePoint Form, a SharePoint List, and a complicated Power Automate flow.
- A litany of improvements and automations in our help desk tool, ConnectWise Manage.
Video Production & Editing
Our company posts videos regularly on LinkedIn and our YouTube channel. These are used as content pieces for existing customers and to showcase our tools and offerings to prospects. I edited nearly every video posted to these platforms in Adobe Premiere. Generally, our videos fall into three categories: short tech topics, webinars, and how-tos. I’ve recorded a few videos on the channel as well, including:
- “Resetting Your VDI Password & Enrolling in Our Password Reset Tool”
- “Connecting to the VDI on a Tablet”
- “Configuring Your VDI Display Settings”
- “Installing the VMware Horizon Client on Windows”
Endorsements from coworkers
John is your go to for anything, literally anything. This guy is a huge team player. I have met very few people with his level of attention to detail and ability to get it done without supervision or previous training. You know a person is great when their worst attribute is trying to fix everything that could be improved. This is John. He is self-motivated, resourceful, a coffee enthusiast, deeply strategic, a good friend, and a great addition to any culture. It would be a mistake to pass up the opportunity to work with a gentleman of his talent, creativity, and drive.
— Chad Holstein, Director of Security & Compliance at ProSource
John is exceptionally skilled in his craft, and has an unparalleled eye for detail. He is forward-looking, always looking for improvements and innovations. I was always thoroughly impressed with the work John has done. John is a great teammate to have, and I hope to work with him again some day.
— David Crane, former colleague at ProSource
This is a living document at the moment and I will update it whenever I get the opportunity. I’m using it to keep track of all the work I’ve done so far.