Brandon Reid is a designer that can code.
Portfolio
Websites
Some websites I’ve made.Most of my work is in web app design & development.
Basalt -->
Designed in Figma, built using Grav. Special care was taken to make every aspect of the site editable from an admin panel so that non-technical marketing folk would be empowered to modify at will. The home page hero featured an interactive array of "color tokens", the visitor would be prompted to select a color and change it to another from a predefined pallet. When changed, the color used in one of the "component" representations would update, fallowed by the SVG based artwork (which was drawn by Portland based tattoo artist, Amado Bermudez).
Trailercraft
Designed in Sketch, built using Next.js. Because Trailercraft serves Alaska and internet connectivity can be unreliable, performance was key for this website. The site was server side rendered for SEO, but once bootstrapped on the users device, it worked like a single-page-app, only requesting the remaining content needed when navigating. Images were requested from the device and the exact width needed was requested via Imgix, so sizes were as optimized as possible. We used CosmicJS as the CMS, which in the end unfortunately proved too technical for the client.
A couple more
My Gift Card Supply
A WooCommerce Wordpress site. Learned a lot about A/B testing and the impact small changes can make on conversion rates.
High Point
Totally custom Wordpress site, custom post types and custom fields allow the client to control all content.
Star Wars Order
Just a site that tells you the order of the Star Wars movies.
A bit about how I design...
Understand the Audience
Great product design starts by researching, conversing with, and compiling data about end users. Being familiar with the people using your product, creating generalized personas with personality and referencing them often, builds empathy. Empathy is key to stimulating the passion it takes to bring a solution to a high level of craftsmanship. Clear, documented user personas also add critical perspective to solution discussions and benefit the entire organization, from design and development, to documentation, content creation, sales and marketing, and beyond.
Define the Problem Well
With well defined, succinct problem definitions, design and development can often start solutioning together at the same time. This allows for a lean, agile approach. Also, by being targeted, we’re better equipped to create solutions that enhance the overall value stream.
Problem definitions can take varying forms from bulleted lists, to well defined user journeys. They should always avoid solution specific statements, but could highlight current data models, etc.
Design and code systematically for quality at scale
Design systems are the foundation of consistency and quality at scale. With a well integrated system, every past feature can benefit from improvements and modernizations applied to new features.
Personally, design systems have been a major focus in my career going back over 5 years.
Validate and Iterate
Test early and often. Design and build with the intention to iterate. Test passively by incorporating data collection into designs. Test actively by engaging users throughout and after the design and development process. Findings from tests contribute to understanding the audience.
Bonus!
I also have a other skills like leadership, business/sales support, and project management. Check out this UX Integrated Product Sprint Cycle I designed and detailed in Figma!