Orbyt-3D Model Interactor
Work Outline:
Web application to help interact with custom 3d models
Tools Implemented:
React JS
React3Fiber
Tailwind CSS
Tweakpane – GUI controller
see more
Orbyt-3D Model Interactor
About:
Have you ever designed a 3D model, and wanted to have a website where you can easily visit, load up your 3d models and do exciting stuff like animate it, have your own mini-map, simulate traffic and other fun stuff? WIthout having to download heavy 3D modelling apps which take a lot of device space and are complicated to use? You'd love this app.
This 3D model Interactor is a web application that is meant to do all these functions, at an even faster rate. It leverages on the lightweight and the rich documentation of React Three Fiber (R3F) – a React version of Three JS, providing quick load times and a smooth and interactive user experience.
Work Summary:
- App created with React JS and packaged with Vite.
- Used sample models from sketchfab.
- Utilized Tailwing CSS for quick ad responsive design
- Setup toggler buttons to toggle in and out of various available modes namely: Animation, model cloning and mini-map features.
- Setup streamlined process to help user achieve whatever iteractions required based on modes selected.
- Ensured responsiveness across various devices.
Tools Implemented:
React JS
React3Fiber (R3F)
Tailwind CSS
Tweakpane – GUI controller
Impershield Systems Limited
Work Outline:
Website Development with blog and E-commerce features
Tools Implemented:
Wordpress
Elementor
WooCommerce
CSS
Photoshop
see more
Impershield Systems Limited
About:
Impershield Systems ltd. is a growing buillding and construction services company, providing high quality building materials and solutions ranging from waterproofing to painting solutions, ensuring long-lasting buildings and structures.
They were in need of a profile, blog and e-commerce website to further extend their customer reach by upgrading their visibility. This website is a neat combination of a portfolio, a blog and an e-commerce platform so anyone, from anywhere can be serviced by this company.
Work Summary:
- Integrated Wordpress and Elementor
- Installed a custom ELementor theme
- Utilized CSS to further modify the website's appearance
- Integrated Woo-commerce and setup the website for online sales
- Edited and optimized images to be used on website
- Setup a customer response feature and a tawkTo widget
- Ensured responsiveness across vrious devices
Tools Implemented:
- Wordpress
- Elementor
- WooCommerce
- CSS
- Photoshop
MovieBox Trailer App
Work Outline:
Movie trailer website with TMDB's API
Tools Implemented:
Figma
React JS
CSS/SCSS
TMDB's API
see more
MovieBox Trailer App
About:
This MovieBox trailer app, as the name implies, gives the user an endless list of trailers for all genres and ratings of movies. Fecthing data from TMDB's API, it gives a range of functions. The user can search for favorite trailers, save favourite trailers even for movies as old as the 90's and enjoy the Nostalgic feelings that come with old memories.
This work was intended to hone my skills on the use and interaction with external APIs.
Work Summary:
- Created the App with React JS
- Created components and fetched relevant links and information from TMDB's API
- Utilized CSS/SCSS to further modify the website's appearance and ensure responsivenss across devices
Tools Implemented:
Figma
React JS
CSS/SCSS
TMDB's API
The Web3 Bazaar
Work Outline:
Landing Page Redesign and Development
Tools Implemented:
FIGMA
Illustrator
Photoshop
HTML
CSS
VUE JS
see more
The Web3 Bazaar
About:
The Web 3 Bazaar is a relaible P2P exchange platform for web 3 assets. They do so by the use of non-custodial escrow smart contracts, making it quick, secure and permisionless.
Although they already had a good direction with their branding, their current landing page looked very bland and unappealing. They called on their community to come up with, and develop a new landing page, mainting the existing colour schemes and typography. My design was chosen out of four other commendable designs, for its uniqueness, and adherence to their requirements.
I further went ahead to develop the new landing page, using Vue Js for the first time, and committed the changes to their repo. The changes are still awaiting approval.
Work Summary:
- Designed the new landing page with figma, bringing life to the landing page while preserving cureent colours and branding styles.
- Designed pixelated icons using Illustrator and photoshop to further enhance the site's uniqueness.
- Worked hand-in-hand with the original devs to further modify the design, ensuring a perfect fit into the project's objectives.
- Developped the new landing page using Vue JS, based on the laid out design, ensuring responsiveness across devices
- Created a repo and committed the changes to Github.
Tools Implemented:
- FIGMA
- Illustrator
- Photoshop
- HTML
- CSS
- VUE JS
LosAngeles Mountains
Work Outline:
Single Page Development from PSD file
Tools Implemented:
HTML
CSS/SCSS
JS
Photoshop
see more
LosAngeles Mountains
About:
LosAngeles Mountains is a one-page website template built to feature some of the most awesome mountain sites in Los Angeles, and to feature shedules for people interested in mountain climbing activities.
Work Summary:
- Desinged the template from sratch with HTML, CSS/SCSS and JS
- Responsive navigation bar, and smooth scrolling to various sections in the page
- Ensured exactness in the use of specified typography as the PSD template.
Tools Implemented:
HTML
CSS/SCSS
JS
Photoshop