DeanHouston
OPW Gas Nozzle Configurator
Design & Development
- CSS
- HTML
- JavaScript
While working at DeanHouston, I was tasked with creating a configuration tool to allow users to customize their OPW Retail Fueling 21 Series Nozzles. Since the project was restrictive with a tight budget, keeping to a form-like layout with text display options was a restriction for creating this piece. An additional restriction for this project, due to their content management system, was sticking to basic HTML, CSS, and vanilla JavaScript in combination with jQuery (since it was already implemented into their CMS) for the build.
Instead of serving the user a basic form, I attached inline data attributes, such as values and incompatibilities, to keep the code easily adjustable and scalable for future inclusion options. With each section and option within the section having a specific character value that's strung into the series number generated on request. I also wanted to make a list — like a line-item reciept — to make it easy for the user to see the options they selected at a glance, rather than combing back through the form.
