My Portfolio
Web Development
I can hardcode and build websites from scratch or use builders such as WordPress and GoHighLevel CRM, among others.
Built from scratch...
The CSS Zen Garden
The CSS Zen Garden is a project started over 10 years ago to show the power and potential of CSS in web design. It’s premise was simple: if you take a single html file, how many different ways could it be styled without modifying the html.
This Pixar Theme CSS Garden is a joint project by Diosa Temblor from the Philippines, Alex Lopez from Brazil, and Hans Junior Mardy from Florida.
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Recreated/original border shapes/SVG images
- Transitions or animations
- SCSS
- Valid compiled CSS
- Github Pages site
Scoots Rentals
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Valid and semantic HTML elements
- Valid and contemporary CSS
- UX/UI design
- Optimized media
- HTML Form
- Javascript, APIs, and JSON
- Follows PARC and typography design principles
- Normalized CSS
- Web Font Loader
- Lazy loading
- CSS Grid/CSS Flex
- Github Pages site
Diosa's LESS demo site
- Implementation of a mockup using Perfect Pixel Google Chrome extension
- Static web design, no functionality
- LESS and node.js
- Built using PHP Storm
Xurprise Delivery
- Static web design
- Layout matches the wireframes
- Optimized media
- Valid and semantic HTML elements
- Valid CSS
My Star Wars Favorite Characters
- MVC pattern
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Valid and semantic HTML elements
- Valid and contemporary CSS
- UX/UI design
- Javascript, APIs, and JSON
- localStorage
- CSS Grid/CSS Flex
- Github Pages site
How's the Weather?
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Valid and semantic HTML elements
- Valid and contemporary CSS
- UX/UI design
- Optimized media
- HTML Form
- Javascript, APIs, and JSON
- Follows PARC and typography design principles
- Normalized CSS
- Web Font Loader
- Lazy loading
- CSS Grid/CSS Flex
- Github Pages site
Dry Oar White Water Rafting
- Static web design
- Layout matches the wireframes
- Optimized media
- Valid and semantic HTML elements
- Valid CSS
Built from scratch...
The CSS Zen Garden
The CSS Zen Garden is a project started over 10 years ago to show the power and potential of CSS in web design. It’s premise was simple: if you take a single html file, how many different ways could it be styled without modifying the html.
This Pixar Theme CSS Garden is a joint project by Diosa Temblor from the Philippines, Alex Lopez from Brazil, and Hans Junior Mardy from Florida.
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Recreated/original border shapes/SVG images
- Transitions or animations
- SCSS
- Valid compiled CSS
- Github Pages site
My Star Wars Favorite Characters
- MVC pattern
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Valid and semantic HTML elements
- Valid and contemporary CSS
- UX/UI design
- Javascript, APIs, and JSON
- localStorage
- CSS Grid/CSS Flex
- Github Pages site
Scoots Rentals
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Valid and semantic HTML elements
- Valid and contemporary CSS
- UX/UI design
- Optimized media
- HTML Form
- Javascript, APIs, and JSON
- Follows PARC and typography design principles
- Normalized CSS
- Web Font Loader
- Lazy loading
- CSS Grid/CSS Flex
- Github Pages site
How's the Weather?
- Responsive web design
- Mobile-first approach
- Layout matches the wireframes
- Valid and semantic HTML elements
- Valid and contemporary CSS
- UX/UI design
- Optimized media
- HTML Form
- Javascript, APIs, and JSON
- Follows PARC and typography design principles
- Normalized CSS
- Web Font Loader
- Lazy loading
- CSS Grid/CSS Flex
- Github Pages site
Diosa's LESS demo site
- Implementation of a mockup using Perfect Pixel Google Chrome extension
- Static web design, no functionality
- LESS and node.js
- Built using PHP Storm
Xurprise Delivery
- Static web design
- Layout matches the wireframes
- Optimized media
- Valid and semantic HTML elements
- Valid CSS
Dry Oar White Water Rafting
- Static web design
- Layout matches the wireframes
- Optimized media
- Valid and semantic HTML elements
- Valid CSS
Built with GoHighLevel CRM
Websites
Funnels
Imitation of client websites, copying their branding from fonts to margins. Please take note that some page elements are dynamic (e.g. job listings, background images, logo) and are subject to change per client websites’ updates.
Built with GoHighLevel CRM
Websites
Funnels
Imitation of client websites, copying their branding from fonts to margins. Please take note that some page elements are dynamic (e.g. job listings, background images, logo) and are subject to change per client websites’ updates.
