We were inspired by trying to find a unique and neat way to display projects in a way that makes it easier for us to present, and in a way that gives the user a good experience when learning about our projects.

What it does

This web-app is a tabbed page where all of our projects are neatly organized into tabs to allow the user to easily learn about what we did.

How we built it

We built this app using create-react-app which uses JSX to create an interface. A CSS stylesheet was used to format every component.

Challenges we ran into

One challenge was working with node.js and react. Before the hackathon, no one in our group knew how to code in Javascript or use node.js, so overcoming this learning curve was difficult.

Accomplishments that we're proud of

We're proud of learning to use react to build our own web apps and include smooth transitions to enhance user experience.

What we learned

We learned how to create tabs using react so that it is not necessary to create a new webpage for different contents. This allowed a smooth transition between pages that we sought. Aesthetics and animations are important parts of a web-app along with functionality. Both play a vital role in the user's overall experience.

What's next for Presentation Web-App

We are considering adding more visuals to our web-app portfolio to enhance anyone's need to display information. Visuals will make it easier to grasp concepts and allow the user to digest information. For example, a flowchart would make it easier to help readers learn our design process for our projects. Additionally, we hope to add more pages as we complete more projects. Such a web-app can be very useful for people who want to make unique presentations or portfolios for their own projects, which can help share inventive projects within the community as well as help freelancers sell their products and become more marketable .

Built With

Share this project: