Projects


card header image

Tshangana Jewelers Landing Page


This design was my first venture into UI design using Figma. It is mainly just a design with no prototypes for an ecommerce project I had planned but had not yet began due to more pressing projects.

Tshangana Jewelers Design

The project was my first venture into UI design. I had started taking tutorials on figma and after designing a whole site based on files given by the instructer, I followed up with this little project as a test to see if I had grasped the fundamentals of what I had learned. It was a basic project as I had not learned prototyping then and an initial design of a project I intended to attempt with MVC.
card header image

eNompilo Web App (initial design)


This design was for my third year project, the eNompilo Web App. While it was an initial design, it has since evolved to meet the growing or unanticipated requirements that came about.

eNompilo Web App Design

The design was my second attempt at UI design and Figma, and my first ever attempt at prototyping. I had to grasp a lot of consepts quicker while working on this design, especially prototyping, plugins and components, all of which came in handy for a project as complex as this one. It may have been the project that helped me understand and love Figma.
card header image

My Professional Portfolio (initial design)


This design is for my professional portfolio. While the final product may have minor differences, it still resembles the initial vision. This design represents how I got used to Figma.

WebWeaver Mendez Design

This design is for my professional portfolio. While the final product may have minor differences, it still resembles the initial vision. This design represents how I got used to Figma. The use of prototyping and components had made the design a lot smoother, and it's also where I experimented with plugins for illustrations, icons and even dark mode.
card header image

Calculator App (CSS/JS Practice Project)


This Calculator App is a CSS & JS practice project. It's a calculator app with basic arithrmetic functions. It's an ongoing project I'll update it to perform more complex arithmetic functions.

Calculator App

  • Github repo
  • Technology used: HTML, CSS, JavaScript
  • See Images
The project is a JavaScript practice project. Using basic arithmetic functions, it serves as a basic calculator that performs simple calculations (addition, subtraction, multiplication and division). As previously mentioned, I intend to use further mathematical functions to make it calculate more complex calculations.
card header image

Clock App (JavaScript Practice Project)


This Clock App is a javascript practice project. It serves to tell time as an analogue clock and has the additional features of a stopwatch and a timer. It's background alos reflects the time of day

Clock App

  • Github repo
  • Technology used: HTML, CSS, JavaScript
  • See Images
This project is a practice project for CSS and JavaScript. It serves as a clock, stopwatch and timer and its most challenging feat is its dynamically changing background. At day time,the clock assumes the colour of the sun and the background, the colour of the sky. At night, it assumes the colour of the moon and the background, the colour of the night sky.
card header image

WebWeaverMendez (Professional Portfolio)


This is my portfolio. It's also an ongoing project (a static site that needs constant updating and improving). It will mainly showcase my skills, experiences, qualifications and projects.

WebWeaverMendez

  • Github repo
  • Technology used: HTML, CSS, JavaScript
  • See Images
This is an ongoing project, my professional portfolio, which is created initially using HTML, CSS & JavaScript. It’s currently a static site, hosted in github pages, displaying my professional and educational experiences and qualifications, along with my completed projects. Having designed and developed the portfolio from scratch.
card header image

QR Code Generator (JS Practise Project)


Another project to help me further understand JavaScript, this one also serves as an introduction to API's for me. It is a qr code generator, where your input (url link or text) is generated to a qr code.

QR Code Generator

  • Github repo
  • Technology used: HTML, CSS, JavaScript, API
  • See Images
The QR Code generator is the first part of twin projects I have been working on to introduce myself to using API's. Using the api https://goqr.me/api/, I was able to create a QR code generatoer that works successfully using HTML, CSS and JavaScript. This has motivated me to work on the second part of my set challenge - a QR code scanner - to go along with this project as a pair/twins.
card header image

QR Code Scanner (JS Practise Project)


This project is a QR Code scanner that works by either scanning a QR Code with your device's camera or by uploading a QR Code from your device's local storage. The scanner's results will be the decoded text.

QR Code Scanner

  • Github repo
  • Technology used: HTML, CSS, JavaScript, API
  • See Images
This is the second part of my QR Code twin project. It is a QR Code scanner to go along with the QR Code generator as both projects were fitting challeges to introduce myself to API's. The API used for the scanner (https://npmjs.com/packaga/html5-qrcode) is not the same as the one I used for the QR Code generator, as I needed a scanner that scanned with a camera as well as support document uploads.
card header image

e-Nompilo Web App (3rd Year Project)


My third year project - a web system for a primary health care facility to better manage patient bookings, records, folders and appointments, and administrative services for the staff.

eNompilo Web App

  • Github repo
  • Technology used: ASP.Net Core, MVC, MS SQL Server
  • See Images
The project is an official, assigned project for my third year Project Module ONT3010. Using ASP.Net Core, specifically the MVC architecture, it is a primary health care system. Users (patients) can book appointment and receive prescriptions, among others, while health workers manage files and appointments.