UX/UI Design: CuriousCity — 10 Things I Learned From My First Hackathon

Mark Richard Pagal
Mockplus
Published in
8 min readMar 23, 2018

Although stress inducing at times, hackathon’s can teach you a lot. From practical implementation, effective decision making, quick design thinking, and over performing, you pick up an extensive amount of knowledge when you and your team fall under the pressures of the shortened timeframe. I feel as if it is one of the best ways to test how much grit and tenacity you actually have as a designer. It forces you to not only be pragmatic, but at best, to be versatile and adaptable to any unexpected situations. I participated in my first hackathon when Mission Hack, a nation-wide event hosted by Hackworks, came to Vancouver. My team and I completed the hackaton with a working product that was able to help human’s on their mission to discover new worlds. We developed an image recognition tool with machine learning and AI implementations that aims to grow a database where people can both learn and share new findings and information at an instant. After all of the things I experienced from this competition, I thought it would be nice to share the 10 things that I learned from my first hackathon.

March 16- 18, 2018

1. Always Scope Down Your Project

When you’re under pressure, it’s natural to think of every single possibility that could aid any of the anxieties that you face. This includes over-thinking. You could spend an eternity developing an idea before actually doing any work. And even then, once you’ve come to solidify an idea, it’s easy to head in the wrong direction when it comes to developing any viable work for a hackathon project. One of the most important things that I learned from my first hackathon was understanding that scoping out the project allows you to work “efficiently and effectively”. This was a saying that my team repeated throughout the entirety of the 48 hours. We needed to find the best possible routes in the shortest amount of time, that also delivered the best possible results. Amongst the various tools we were taught in UX & UI, we had to find the most productive approaches to developing a top-tier, contender level product.

2. Design Studio with your Devs

A moment of brilliance came through a very quick design studio session. As a UX/UI Designer, one of the methods we found to be effective when handling clients in a team setting was conducting a design studio. A design studio is a designing method in which all of the team members come together to build/draw out the paper mock-ups of screens. However, instead of creating every single screen, we made decisions based on the primary interaction points of a user with the development team. The brilliance of this moment was that, along with other methods of project managing, this specific model was able to help us dictate the flow of the project. Conducting a Design Studio also helped my team stay on the same page by challenging everyone’s mental models on each of the created screens.

3. “But Why?”.

After forming our team, we all moved into a room where we developed our project plan. Trust me, it will get messy but it’s definitely worth it. What helped us get through this process effectively was always challenging each other’s thoughts and opinions. By asking “why?” you are able to get your opinion across to your team members about their choices. This will ideally help you rationalize the project and keep you on the best route when it comes to developing a great product in such a short amount of time.

4. Work outside of your comfort zone

Work outside of your comfort zone
One thing that I found to be effective was having the willingness to learn. Even though it might not be as efficient during a competition such as a hackathon, taking the risk of trying something new will always help you grow as an individual. This was the first time I had ever taken on the responsibilities of handling the User Interface for a mobile project. It was also the first time that our Dev team had attempted to build a mobile application. Even though I have a graphic design background, using my skills in a competition setting really made me feel like I was responsible for more than just the functionalities of the project. I had to prove to myself that I was capable of being a multi-dimensional designer by taking on the responsibilities of handling both UX and UI for this project. I learned how to implement my designing techniques to a mobile interface while my Dev team taught themselves REACT Native in less than 24 hours. You’ll be surprised at what you can achieve when you’re in an uncomfortable position.

5. Take Breaks

Simple enough, taking breaks are an essential part of hackathons in my opinion. I learned that giving yourself a breather can help you re-evaluate the steps you’ve taken while giving your self the opportunity to look at your work from another perspective. We all tend to hit a “flow” state sometimes when we are so immersed into our work but it’s good practice to take a step back and fine-tune all of your choices after a sprint of brilliance. It also helps to just take your mind away from the pressures of the time constraints for a moment. Taking a walk or shifting your focus elsewhere can easily help you retain and reformat all of the work you’ve accomplished.

6. Push your limits

Don’t be afraid to go the extra mile, even when you think you’ve done enough for the project. Try something that can benefit the team. For me, I took the initiative to build out more screens in our prototype so that we can give more context to our evaluators. Although this may have gone out of scope for the MVP of the product, this was a good way to exercise my creativity after we had solidified the final product. Once you’ve gotten to where you need to be, see how far you can take it! This action allowed us as a team to not only deliver an MVP but to also deliver an entire eco-system (in the making) just by constantly pushing ourselves and not being lazy.

7. Stay Innovative

Staying innovative is definitely difficult. With a jungle full of applications that are at our disposal, it may be hard to build something that hasn’t been introduced already. That being said, some advice to give is that you should let your imagination run for miles when you’re given the scope of the project. Because even the most obscure ideas can change the world. Whether it’s a new building material, a new image recognition tool, or even biotech implementations, we all have the abilities to create feasible and viable versions of anything we set our minds too. Although the topic of the hackathon was to help settlers discover a new earth through tech, you should try to attempt the unthinkable.

8. Personas

A standardized tool in UX and Marketing is creating a user persona. This methodology helped our team flourish in its ideas. When referring to a user, we were able to fictionalize some of the best scenarios that our users would face. From a Dev perspective, it allows you to understand the user’s needs and frustrations on a level where the practical moves became viable features. From a UX/UI perspective, we were able to use our design thinking to the fullest extent when it came to building a User flow. We ended up building 3 personas for this project. Persona A represented Day 0 of the settlers coming to new earth. Persona B represented Day 30 and how the application would have grown in that time frame, also how it would benefit societies first 30 days. Persona C represented the average user in our future considerations and how the database of our product would have grown. Designing around a persona for the hackathon was one of the greatest decisions we made.

User Personas

9. Scrum Scrum Scrum!

UX, UI, and Dev teams are accustom to the scrum methodology. In this case, we made it a priority to keep everyone in the proper headspace, on the same page, as well as being held accountable for the expected results needed for us to achieve our goal. We managed to conduct a scrum session every 4 hours to see where everyone was at in terms of Development and Design. This proved to be one of the most effective tools we used because it not only set the grounds for perfect communication, it also allowed each team member to reflect on what was needed to successfully complete the project at hand. Hearing the progress and the challenges on a frequent basis definitely helped my team build a strong sense of trust between one another.

10. Have Fun

Whether or not the hackathon works in your favour, it is important to always enjoy the time you take to grow as an individual. Cracking jokes and having fun amongst your team helps relieve the stresses that these event bring. They’re also very important in the fact that these slight gestures help your team grow and develop in the most organic way possible. It’s okay to take the project to a degree of professionalism, however, you’ll always remember the moments that you found to be the most fun. And although it is also normal for us to be in the competitive spirit, It’s also equally important to remember that even if you lose a hackathon when its all said and done, remember that you’re better than the individual at the start of the competition.

Final Thoughts:

Being able to work with like-minded individuals who aren’t afraid to push the envelope made the work flow of the project feel seamless. I couldn’t have imagined the result of our application and better yet, the final results presented by the judges. Taking down one task at a time to create an innovative product was an experience to remember. Crossing my passion for design and human-centred solutions really made this project feel rewarding. I’d like to present our final prototype for you to have a look at. This project lasted 48 hours. #TeamCuriousCity.

--

--