StudentSell

Inspiration

We noticed that students on campuses had many hobbies and talents they’d advertise on social media. For example, a student who likes to bake would post cupcakes they made on instagram or twitter and ask their followers to message them privately if they wanted custom pastries. Or, for campus clubs who would sell foods, clothes, and drinks for their fundraisers.

Our team wanted to create a product that would allow college students and organizations to sell and buy with their peers in a more convenient place, streamlining the process and giving students a broader reach.

What it does

With StudentSell, university students and organizations are able to buy and sell listings within their respective college communities. Students sign up by creating an account with their .edu email. Unlike most apps, StudentSell allows students to schedule a time when they wish to pick up their purchases from university organizations. This saves them the time that would be spent waiting in line, allowing them more time to focus on their other everyday tasks. StudentSell works as a way to make college life much easier and stress free and helps build a community amongst users.

How we built it

The hi-fi prototypes for the app were built in Figma with logo illustration being done in Procreate. The app was then coded with the use of HTML, CSS, and python using the Flask framework to connect StudentSell to the HTML and CSS files, and a local server.

Challenges we ran into

Alex - Learning front-end languages (HTML/CSS) for the first time was overwhelming at times and I got stuck a lot! Translating design and functions into code as closely as possible was difficult within the short time frame. Learning Flask and restructuring HTML files to collaborate with the back-end code took more trial-and-error than I expected. I found it was difficult to get all the screens and functions in due to this.

Kristine - Being the sole UI/UX designer for this project taught me a lot about dedication, commitment, and time management. Having to dedicate a lot of hours into developing my frames taught me what I should or shouldn’t do, but I ran into a lot of errors especially when I was testing the app flow of my work. It was a lot of trial and error but I was proud of myself for persevering and remaining committed to producing the best design I could. I’m really proud of what our team has produced and I’m looking forward to only improving from here.

Accomplishments that we're proud of

With this being our first hackathon and the first app we’ve attempted to build, our team was really proud of how much we pushed ourselves to learn new coding languages and develop a large amount of screens within the 2-3 day period. Our perseverance to create a feasible app is something we are satisfied with when we reflect on the weekend.

Kristine was able to design StudentSell with every function and feature we initially agreed we needed. The linking, art, and variety between the pages and design was something we were extremely happy with.

Alex was able to dive head first into learning front-end coding and bring to fruition several screens and functions presented in the Figma design. She also learned how to get the HTML+CSS to collaborate with the python code to allow StudentSell to be more dynamic and operate on a server.

What we learned

Alex - I learned so much about HTML and CSS. How the two work together to create a page, aesthetic, and functionality is really interesting. I had such a good time learning the languages, and have a newfound appreciation for the applications and websites I use! Seeing how servers and databases interact with the HTML and CSS was another notable moment. My understanding of web applications has increased ten-fold, and I feel much more confident in trying future projects and pushing myself. I also learned that a clear design makes the front-end AND back-end process easier in the sense that it was easy for me to understand what information Kristine wanted and needed on a page (info needed in the back-end), and what functions needed to be possible (presentation on the front-end).

Kristine - I was able to learn a lot more about Figma and have become more comfortable using the tool over my previous preference for wireframing/prototyping: Adobe Illustrator. Before, I would usually depend on my teammates to teach me the ropes, but having to dedicate hours this weekend to developing my frames has helped me memorize a lot of what Figma has to offer. I was able to develop more as an artist too as I took part in our app’s logo design and learned more on the design side. I hope over time my UI designs again become innovative and modern like a lot of designers I look up to.