Happy Face | Devpost

Inspiration

As teens, we've had our fair share of skin horror stories. We drew inspiration from our own experiences, sharing advice among friends and recommending different products. Following the trend of the many health-related trackers that are entering the market nowadays, we wanted to create a space where people could keep tabs on their skin to see what products or methods were really working for them.

What it does

The desktop site features information talking about the platform and the business's vision/goals. The bottom features a Register form that users can fill out with basic information (name, gender, phone number). There are two different profile versions for males and females. The name is extracted from the form and then plugged into the user's respective profile, as well as a Twilio message, which will send the link to the app to the user's phone via text. Once on the platform, users can upload photos to create a photo diary of their skin to have a visual means of tracking their progression. Users can add the skincare products they use on a daily basis to their Routine page. They can also tag their profiles with different skin conditions/categories, such as dryness or acne, and give the conditions a daily rating of 1-10 to track relief/worsening conditions over time. These tags work to help a search function, in which users can search through all other users profiles, based on these tags. By seeing other people's profiles with skin issues similar to theirs, they can discover new products and routines that are successful for people in a similar biological demographic.

How I built it

Our group is very limited in coding knowledge and background. However, to create a mock-up of the concept, we used Adobe Muse with some independently coded HTML objects as front end design tool to allow us to achieve the setup we wanted. However, to prove the back-end part of the concept, we also created a few simple classes using Eclipse in Java that mimic what we want to have happen in the real application. Note: desktop version is an info site; mobile version is a mock profile setup.

Challenges I ran into

The "app" portion of our hack is currently just a specialized version of the mobile site. With our limited background, we were unable to create a native app that met the needs of what we were looking to do. As a result, we decided to go with a mobile site, as it would be simpler to achieve our goals in that format with the intention of converting it into a web app later on.

The form on the desktop site is function, but it currently sends the form to my email. The Twilio number does not have an SMS gateway we can use to make it an email, and though there is a way around this through Javascript, because we are using an unlaunched Adobe Business Catalyst site for our demo, other than the few individually coded objects, for the site itself, we were unable to modify any of the code for any script. For demo purposes, we display to the judges what the prompt would look like should the form go through to the Twilio number.

The mobile site is currently also just a mockup. Because we were unable to edit any of the HTML code from our site, we were unable to execute the features that required image uploads, since the feature is unsupported in Muse. For presentation purposes, we preset pictures in as a display.

Accomplishments that I'm proud of

Being able to make it look so pretty! We're also proud of being able to make the connections between the code we did know and intended execution and features of the end-design of the site.

What I learned

While Muse is an easy tool to use when you need to make something look really great in a short amount of time, being able to code the design from scratch gives you so much more freedom. Keeping a cohesive look throughout all elements of a site can also be difficult.

What's next for Happy Face

We want to create a recommended products generator based on the results of similar users who saw improvements from those products. (This can easily be done by a simple counter system.) There is also a substantial space for monetization through our app. We would like to keep it free, as we believe that a healthy skincare routine should be learned and maintained by everyone without limitations, but through hyperlinking the products individuals use to sponsored sites, we will be able to earn commission as users adopt products based on recommendations by other users on the platform.