Project Samples
Below are links to previous work samples pertaining to projects I have completed either in freelance or employment role. All of which, containing media queries and CSS layouts responsive to mobile and other devices of varying sizes.
Custom Mobile Bottom Nav
This recent Wordpress example highlights a custom mobile responsive fixed bottom navigation bar containing the following buttons: hamburger bun, SMS, call-to, and email buttons for a Wordpress build that utilizes Bootstrap 4 and custom CSS elements to display the menu at the bottom of the screen for device widths under 880 pixels.
Thus, making it easier for the user to navigate using one hand. Moreover, enabling the voice calling or SMS features on user's mobile device.
Wordpress
Here are three Wordpress custom theme projects that were completed in collaboration with a local agency that provided content along with a full screen sized static design mock-up for me to emulate and make fully responsive:
Growing Smiles
Happy Pediatric Dentistry
In addition to Wordpress, modern Javascript and styling development techniques used in creating the appearances associated with the above business websites, include: NodeJS, NPM, Grunt, JQuery, and SCSS .
Designing for Email
The techniques used to create markup for web pages and email campaigns that render consistently in all Email Service Providers (ESP), are very different.
I will use a pre-employment screening test pertaining to an email developer role to demonstrate my email design skills. The objective was to re-create this PNG image using 9 URLs pointing to slices hosted on the employer's server. I wrote the entire HTML markup from scratch (view source in browser) to produce this result
1.) PNG Image2.) Slices 3.) HTML
Pure CSS Modal Popup
Adding a modal popup is typically a simple task that can be performed using the Bootstrap modal plugin, but when I encountered a multitude of Javascript conflicts that broke the site-wide layout of a Wordpress site that I inherited... my solution was to custom-build a 100% pure CSS (zero Javascript) fully functional modal pop-up window. Here is my original prototype script that I later customized for use on the landing page of the live production website.
Modal Prototype
Asset Manger
During a period of my employment with Lead Systems Technologies, LLC., one of my many roles was providing technical support throughout the call-center and both the Sales and IT departments. Which involvied accounting for the company's entire inventory of hardware components and recording the location of the work station it was installed in. As well, tracking the users of each work station. In order to streamline the process, I created an Asset Manager database application intended for mobile devices running a QR Coce scanner app. Since the interface is a Bootstrap 3 template, however, the responsive design conforms to desktops, as well.
The fully custom back-end development runs on a LAMP stack framework; ie: Linux, Apcahe, MySQL, and PHP. Data is stored on a MySQL relational database.CRUD operations are performed in PHP and utilizes TWIG for dynamic rendering of output to the browser.
Click Here To View
