Marcus Hodges - Maker of Web Things

Things I’ve Made

marcushodg.es - Personal Portfolio | 2023

I designed the site you're looking at now way back in 2017, and had coded it using only static HTML and Vanilla JavaScript with SCSS for styling.

In 2023 I decided to keep the same content and design, but update the tech stack to something more fun and easier to maintain - namely Next.js, Contentful for content management, and Vercel for deployment. I also chose Tailwind for styling.

The new site is blazing fast - with First Contentful Paint averaging less than one second - and much easier to update. I'm very pleased with the result.

You can view this source code at Github.

Roles

Front End / UI Developer, UI Designer

Tools And Tech

React, Next.js, Tailwind, Contentful CMS, Vercel

iFIT App | 2021

I spent the start of my time at iFit working on our consumer app, which consisted of React single-page apps loaded as webviews on their native Android and iOS apps.

I helped create and maintain several features in the app and contributed regularly to internal UI libraries for their design system and common webview elements.

We moved previously native features into webviews using React, SCSS, TypeScript, and unit testing.

More information about the app can be found at ifit.com.

Roles

Front End / UI Developer

Tools And Tech

React, JavaScript, TypeScript, HTML, CSS, Jest, React Testing Library, Storybook, Cypress

iFIT.com | 2018

While on a marketing squad at iFit, I undertook a sweeping site redesign. Because of the nature of marketing sites, a lot of that work has changed in the years since, but many components remain the same.

Roles

Front End / UI Developer

Tools And Tech

React, HTML, CSS, JavaScript

FedEx Digital Hero Training | 2017

FedEx needed an interface for an employee learning experience. We created a single-page learning experience for FedEx employees, delivering highly interactive training with graceful fallbacks for older browsers.

I helped design and develop the interfaces for interactive learning, including learning modules, challenges, and tests.

There are no public links to this work. Please get in touch for details. You can find more information about Fathom at mindspace.net/fathom

Roles

Front End / UI Developer, UX Designer

Tools And Tech

HTML, CSS, JavaScript, User Flows, Wireframes

Google Retail Associate Training | 2016

IE8 y’all. It’s true. We made animated games, learning modules, and other templates that worked all the way back to my browser war nightmares.

Our job was to make the benefits of Google hardware sticky to retail sales associates; with our animated games, learning modules, and interactive quizzes, we were able to send translatable training to associates around the world.

There are no public links to this work. Please contact me for details.

Agency

Mindspace, BYND

Tools And Tech

HTML, CSS, JavaScript

Starbucks Barista Basics Training | 2016

Starbucks came to Mindspace to create and deliver employee training for new hires and current employees. We created interactive tutorials, tests, and games to help baristas learn and retain important information.

There are no public links to this work. Please contact me for details.

CSX.com Redesign | 2015

Though developed and launched after I left Mullen, this stands among the most passion I’ve ever felt with a project. A life-long "rail fan", working for CSX was a dream.

From day one, I was down in Jacksonville talking with the client and their stakeholders and users. We crammed into hotel conference rooms all night, arguing and sketching and building prototypes until we left with something they could understand both in theory and on screen. We left with information architecture, wireframes, and audience research to help inform and improve the work of our creative and development teams.

Back in NC, I led a team of UX / UI designers who helped bring the results of our summit to life on screen, with my creative direction. We wireframed and designed each template of the site, along with coded prototypes of various motion designs to be finished off by their in house dev team.

Roles

Digital Creative Director, Technical Director, User Experience Designer, Front End / UI Prototype Developer

Tools And Tech

Wireframes, Stakeholder Interviews, User Interviews, HTML, CSS, JavaScript

HondaJet Landing Page | 2014

I loved working on this. We ended up with an awesome parallax experience that works wonderfully in nearly every browser, including mobile, tablet, old IE, etc, thanks mostly to progressive enhancement. It worked great then, and it still works great now.

I threw the book at framerates and kept this thing around 60fps, in spite of the challenges of moving around large images.

Roles

Front End / UI Developer, Technical Director, Motion Designer

Tools And Tech

HTML, CSS, JavaScript

Places I’ve Worked

Abercrombie & Fitch Co: Engineering Manager | 2023-current

I'm just starting on July 31. More to come.

Simple Thread: Principal Software Engineer (Front End) | 2023-2021

Simple Thread makes custom web-based software applications.

As a Principal Software Engineer, I used my front-end experience to build applications using technologies such as Vue, CSS, Tailwind, and Javascript. I was also responsible for code reviews, researching new technologies, as well as facilitating standups and planning meetings.

Simple Thread is a remote-first company. We used Figma, Slack, and GitHub daily and collaborated with team members nationwide.

Project Roles

Front End Developer, UI Designer

Tools And Tech

HTML, CSS, Tailwind, JavaScript, Vue, Figma, Ruby on Rails

Clients

Dominion Energy, Source for Learning, AP Trust

iFit: Director of Developer Experience, Web and TV | 2021-2017

iFit is a home-fitness app built into NordicTrack equipment, along with separate tablet and mobile apps.

As a director, I was responsible for helping managers and their reports grow and thrive through advocacy, coaching, and mentorship. I also helped define and roll out technical best practices and training programs throughout the development team of 50+ members.

As a contributor, I worked primarily in TypeScript/JS (React) and CSS. We also regularly used Storybook, React Testing Library/Jest, CSS Modules, and Cypress. We were fully remote and communicated with Slack, GSuite, and Jira. Designs came through Sketch and Figma, and we used Github for code management.

Project Roles

Front End Developer, Engineering Manager, Director of Engineering Managers

Tools And Tech

React, JavaScript, HTML, CSS, CSS Modules, React Testing Library, Jest, Figma, Sketch, TypeScript, Storybook

Mindspace: Lead Front End Developer | 2017-2015

Mindspace makes industry-leading learning on digital and analog platforms.

Working with technologies like HTML, CSS, JavaScript, React, Jekyll, and more, I led the team in creating cutting-edge learning materials, games, and other experiences to help users learn and retain information.

I led research and whiteboard/prototype sessions on the UX side and worked with visual designers and developers to craft the finished products.

Project Roles

Front End / UI Developer, User Experience Designer, Technical Director

Tools And Tech

React, JavaScript, HTML, CSS, Sketch, Whiteboarding, User Flows, Prototyping, SCORM

Clients

Starbucks, Google, FedEx, State Street, Mercer, American Heart Association, Cedars-Sinai

Mullen / MullenLowe: Lead Creative Technologist | 2012-2015

I was fortunate to be able to help recruit and lead a team of UX and UI designers, along with full stack, front end, and email developers. I consulted on all things digital for our clients and in-house / new business projects, and kept busy pitching creative concepts or working with developers to find the best technical solutions for the job.

I was hired as a developer, and used that foundation to help steer the technical direction of the agency. I worked alone, with teammates, and with outside contractors to create the technology for our campaigns.

I also led the digital UX and UI design teams and involved myself deeply in every project from brief-writing through delivery, serving as an ambassador for digital and creative technology throughout the agency, leading regular digital / technology-based training classes. I also worked closely with project management and was key in helping scope projects.

Project Roles

Digital Creative Director, Technical Director, Front End / UI Developer, Producer, UX Designer, Hiring Manager

Tools And Tech

HTML, CSS, JavaScript, Wireframes, Prototypes, User and Stakeholder Interviews, Card Sorting, Personas

Clients

HondaJet, CSX, Gaia Herbs, Pep Boys, Auntie Anne's, Food Lion, TRESemmé

Airtype: Front End Developer | 2010-2012

I created all front-end code for every Airtype project, using primarily HTML, CSS, and Javascript. I also assisted with integrating that code with back-end platforms such as WordPress, ExpressionEngine, Shopify, and CodeIgniter. I helped found a non-profit educational program to teach younger people how to code via lecturing at local schools and community colleges supported by Airtype.

Project Roles

Front End / UI Developer

Tools And Tech

HTML, CSS, JavaScript, jQuery, ExpressionEngine, WordPress, Shopify

Clients

American Spirit, Grizzly Tobacco, R.J. Reynolds, Wake Forest University

Pixelluxe: Owner / Lead Developer | 2006-2010

As a freelance independent shop and first “real job”, I helped agencies turn their creative into working sites and apps. I was solely responsible for all code creation and evaluation on front and back end platforms, and steered away from working directly with clients in favor of repeat engagements with agencies instead. I also recruited and managed contractors when appropriate, and consulted clients on best practices for UX, accessibility, and information architecture.

Project Roles

Developer, Technical Director

Tools And Tech

HTML, CSS, JavaScript, jQuery, ExpressionEngine, WordPress

Clients

NBC, Microsoft, Rifftrax, The Body Shop