In the span of 3 weeks, I prototyped, designed, and published One Step, a website for seemless habit tracking that keeps you accountable and encourages you to take that next step towards the goals you've always wanted to achieve. This website is a sneakpeak to the UI design of what could become a full-fledged business.
2025
UI DESIGN
UX DESIGN
HTML CODING
CSS CODING
PROTOTYPING
Personal Project
This website was entirely coded and published through git-hub using HTML & CSS. I used the program netnet.studio, and coded everything entirely by hand.
I went through the full process from ideation to final product, conditioning myself to work in a pipeline that is identical to companies of website creation or app development. By articulating myself through each stage of the process, I was able to develop both my skills and understanding of how each step works with the other in order to create a final product.
Link: Website
After learning HTML and CSS for a few months, I created this project to integrate my coding abilities with my design skills to create new avenues of design projects. Creating a website has always been an interest of mine, so I wanted to practice the full process pipeline of idea-to-website.
I chose a habit tracker website as I believe that current-day apps/websites aren't made with the user in mind. Having tried to get into habit tracking myself, I noticed how zero online applications worked, so I decided to use my expertise to create one that puts user experience first.
I used my Figma skills to develop a mockup of what the website would look like. When creating the website One Step, I made sure to keep in theme of my vision when designing the format and colouring. I made sure the interface was minimalist, easy to read and navigate, and visually pleasing.
For the colour palette I picked teals, blues, and a deep grey to create a sense of calm to the viewer (as blue is associated with calmness), and the dark background to again express serenity while also feeling grounded.
One of the greatest challenges when developing the website was the transition of designing the website to coding it to life. I struggled through many different formatting challenges with HTML & CSS. Certain sections proved very difficult to code despite the initially simple format, and certain barriers came across that therefore required me to think outside the box for solutions. Just like in a professional environment, throughout the whole project, different iterations were made which resulted in the final product being different, and much more visually pleasing, compared to the initial mockup.
The photos show changes made throughout the website (left is initial mockup, right is final website)
This project was a great challenge, that resulted in a website design that is unique, easy to read, and simple to use. Through this project I developed not only hard skills such as coding and design, but also soft skills like problem-solving and perseverance.
When building this website, I deepened my understanding of each of the roles and skills required to create a final product. Which develops my intuition and teamwork skills for when needing to work in a professional group setting.
In the span of 3 weeks, I prototyped, designed, and published One Step, a website for seemless habit tracking that keeps you accountable and encourages you to take that next step towards the goals you've always wanted to achieve. This website is a sneakpeak to the UI design of what could become a full-fledged business.
2025
UI DESIGN
UX DESIGN
HTML CODING
CSS CODING
PROTOTYPING
Personal Project
This website was entirely coded and published through git-hub using HTML & CSS. I used the program netnet.studio, and coded everything entirely by hand.
I went through the full process from ideation to final product, conditioning myself to work in a pipeline that is identical to companies of website creation or app development. By articulating myself through each stage of the process, I was able to develop both my skills and understanding of how each step works with the other in order to create a final product.
Link: Website
After learning HTML and CSS for a few months, I created this project to integrate my coding abilities with my design skills to create new avenues of design projects. Creating a website has always been an interest of mine, so I wanted to practice the full process pipeline of idea-to-website.
I chose a habit tracker website as I believe that current-day apps/websites aren't made with the user in mind. Having tried to get into habit tracking myself, I noticed how zero online applications worked, so I decided to use my expertise to create one that puts user experience first.
I used my Figma skills to develop a mockup of what the website would look like. When creating the website One Step, I made sure to keep in theme of my vision when designing the format and colouring. I made sure the interface was minimalist, easy to read and navigate, and visually pleasing.
For the colour palette I picked teals, blues, and a deep grey to create a sense of calm to the viewer (as blue is associated with calmness), and the dark background to again express serenity while also feeling grounded.
One of the greatest challenges when developing the website was the transition of designing the website to coding it to life. I struggled through many different formatting challenges with HTML & CSS. Certain sections proved very difficult to code despite the initially simple format, and certain barriers came across that therefore required me to think outside the box for solutions. Just like in a professional environment, throughout the whole project, different iterations were made which resulted in the final product being different, and much more visually pleasing, compared to the initial mockup.
The photos show changes made throughout the website (left is initial mockup, right is final website)
This project was a great challenge, that resulted in a website design that is unique, easy to read, and simple to use. Through this project I developed not only hard skills such as coding and design, but also soft skills like problem-solving and perseverance.
When building this website, I deepened my understanding of each of the roles and skills required to create a final product. Which develops my intuition and teamwork skills for when needing to work in a professional group setting.
In the span of 3 weeks, I prototyped, designed, and published One Step, a website for seemless habit tracking that keeps you accountable and encourages you to take that next step towards the goals you've always wanted to achieve. This website is a sneakpeak to the UI design of what could become a full-fledged business.
2025
UI DESIGN
UX DESIGN
HTML CODING
CSS CODING
PROTOTYPING
Personal Project
This website was entirely coded and published through git-hub using HTML & CSS. I used the program netnet.studio, and coded everything entirely by hand.
I went through the full process from ideation to final product, conditioning myself to work in a pipeline that is identical to companies of website creation or app development. By articulating myself through each stage of the process, I was able to develop both my skills and understanding of how each step works with the other in order to create a final product.
Link: Website
After learning HTML and CSS for a few months, I created this project to integrate my coding abilities with my design skills to create new avenues of design projects. Creating a website has always been an interest of mine, so I wanted to practice the full process pipeline of idea-to-website.
I chose a habit tracker website as I believe that current-day apps/websites aren't made with the user in mind. Having tried to get into habit tracking myself, I noticed how zero online applications worked, so I decided to use my expertise to create one that puts user experience first.
I used my Figma skills to develop a mockup of what the website would look like. When creating the website One Step, I made sure to keep in theme of my vision when designing the format and colouring. I made sure the interface was minimalist, easy to read and navigate, and visually pleasing.
For the colour palette I picked teals, blues, and a deep grey to create a sense of calm to the viewer (as blue is associated with calmness), and the dark background to again express serenity while also feeling grounded.
One of the greatest challenges when developing the website was the transition of designing the website to coding it to life. I struggled through many different formatting challenges with HTML & CSS. Certain sections proved very difficult to code despite the initially simple format, and certain barriers came across that therefore required me to think outside the box for solutions. Just like in a professional environment, throughout the whole project, different iterations were made which resulted in the final product being different, and much more visually pleasing, compared to the initial mockup.
The photos show changes made throughout the website (left is initial mockup, right is final website)
This project was a great challenge, that resulted in a website design that is unique, easy to read, and simple to use. Through this project I developed not only hard skills such as coding and design, but also soft skills like problem-solving and perseverance.
When building this website, I deepened my understanding of each of the roles and skills required to create a final product. Which develops my intuition and teamwork skills for when needing to work in a professional group setting.