Outlaws

Inspiration

The moment we saw the western theme, we realized we had the perfect idea in mind. It just so happened that we were competing with each other on a reaction time timer website a day before, and we knew that we wanted to code a Mexican standoff. We thought it fit perfectly with the YeeHaw! theme and that all cowboys would feel right at home, competing for the fastest hand in the west.

What it does

Users can select their character and name, and queue up to face each other in a battle of speed. Whoever has the fastest reaction time and shoots first robs their opponent cowboy or cowgirl and gets one step closer to being the richest wrangler in the Wild West. You keep the same gold between matches, and obtain a portion of the money of whoever you beat. Be careful, the more wealth you have, the more you risk to lose each match!

How I built it

We created a react front-end endpoint hosted on Heroku. On the back-end, we hosted a flask app with an SQLAlchemy database based on a separate Heroku endpoint. The pixel art was created and animated mostly using Piskel, and we used react and styled-components to organize and spruce up the front-end. We also attempted to host several blockchain endpoints on different Heroku endpoints as well, before realizing both 1.the difficulties involved in implementing blockchain and 2.how shoehorned in the technology would be.

Challenges I ran into

We didn't have a methodology coming into the hackathon for how we would approach the hack, and we developed the front end and back-end portion of the user-to-user interaction separately and without unit testing. As the weekend continued, we had to piece together our project, and debug countless errors. Our biggest challenge, however, was the integration of blockchain into our game. We attempted to use blockchain to keep a list of transactions between the winning and losing cowboys, embedding the block chain within the framework. Unfortunately, we ran into multiple issues regarding the recognition of other nodes and the structure of the chain collapsing in strange ways. This was ultimately a benefit as it helped us realize the main goal of our project, and refine our idea into a tightly focused game.

Accomplishments that I'm proud of

We are really really proud that you can actually face other players on a live site, as we designed our own architecture for the task (having no experience with it). We are also proud of the custom-made pixel art/animations and our video direction! Shout out to our artsy hacker on our team! : )

What I learned

None of our team had worked with blockchain before, so while we didn't end up ultimately using it in our project, we can carry our new knowledge forward with us. Our struggles with connecting the front-end and back-end have more than convinced us of the usefulness of testing while we code as well.

What's next for Outlaws

Outlaws is going live on outlaws.space, and we will attempt to expand the game's player base as we add more features and ways to track your score and compare with other people over many sessions.

Built With

flask
javascript
piskel
python
react
sqlalchemy
styled-components

Submitted to

YeeHaw Hacks

Created by

I worked on the back end to build user profiles and then create a que to pair players. I also implemented the algorithmic portion of the game on the front end side.

duttar18 Dutta
I was learning blockchain with another team member, but I pivoted to work on the back end, using Flask to develop the routes and later helped with debugging on both the front and back end.

lijames106 Li
I worked on the FrontEnd React portion of the app and certain backend APIs. I was in charge of creating all the gifs, animations, and overall look of the project. I used styled-components and Javascript to animate and communicate with the backend. I was also in charge of creating the video and doing voiceovers.

Daniel Zheng
I made an blockchain app and node to run on Heroku which was built by using Python

Jai G