CEO SMI-O

Custom calendar made in Figma
Custom products page design made in Figma
Custom about us page design made in Figma
Home page design, implemented in GitHub project (with gamification)

Inspiration

The inspiration of our project was the gamification of shopping. Thus we wanted to draw on the addicting qualities of video games, especially gacha/loot boxes aspects and try to apply those within context of E-Commerce. We also loved a artist Smino so we based our website around him and his products.

What it does

So within our project, we used Figma and HTML/CSS/JavaScript to create a website that implements some of these addicting qualities of video games such as having a wheel/loot box, flashy advertisements, and point system. While not all of these were implemented within the final website, the wireframe would have those.

How we built it

We primarily used Figma to draft out our ideas, especially making each landing page. With the time constraints we were not able to implement every page the way we wanted to but we were also able to create a website using HTML/CSS. With this landing page we are able to just display some of the addictive qualities and learn a lot with certain aspects of front end development.

Challenges we ran into

Not only did we face challenges just trying to complete the project software wise, but also hardware wise. Two of our team members laptops broke during the weekend for various reasons and we had to get loaners, luckily most of the data was saved on the cloud. Software wise, there was a lot of learning, a lot of research in terms of teaching ourselves Figma and HTML/CSS/JavaScript. There were quite a few very time-consuming beginner mistakes made that we've definitely learned from and hope to not repeat next time.

Accomplishments that we're proud of

One thing that we're very proud of was being able to create a prototype on Figma that in our opinion looks decent! We also implemented a functional pop up window, little bouncing reward hitbox, and a wheel for the user to get hooked on after hours of research and trial and error.

What we learned

We learned a lot about Figma and HTML/CSS/JavaScript, coordinating front-end/backend and drafting/wire framing ideas of a website. There was a lot more within the specifics, but this was a great experience for us to have fun and work together and learn.