How To Manage a Cross-Functional Team to Build a Web App in 10 Days

As a task in one of my learning programs, we, the interns, were asked to work on a collaborative project which we refer to as Hackathon.

For this collab, my team (which consists of product designers, frontend and backend developers, cloud engineers, data analysts, and product managers) and I built a product called StartupPlan which is a platform aimed at helping small businesses and startups to effectively draw up business plans, register their businesses and gain professional legal and financial advice.

Cool right? We built it from scratch!

In this article, I will be explaining to you how I was able to manage and push my team to successfully build and launch a webapp in ten (10) days!

Day 1: Hold a Stakeholders Meeting

Run a quick ideation and product discovery meeting with the stakeholders of the project. In this meeting, the product owner should be present (if different from any team member).

This meeting aims to highlight the core problem you wish to solve and the solution you are proposing. You ought to light up a spark in your team during this meeting. They need to buy into your vision so they can effectively do their parts.

You can use Google Meet, Zoom, Zoho, etc to have your meeting and while you're on it everyone should also be on a collaboration tool like Figma to drop ideas based on what you have pitched to them. An initial solution sketch should be drawn up at the end of this meeting. This will typically take 2-3 hours if everyone participates as they should.

Day 2: Run a product analysis, user research, and market analysis

It is not enough to think your idea is good. You need to validate this idea so a quick user research and survey should be done. The market you wish to delve into should be analyzed and a SWOT analysis of your product should be done as well.

Day3: Assign tasks using task management tools

Divide and conquer. You may have the idea but need all hands on deck to bring this idea to life. All members of your team need to know what they are working on and when it is due. You need to correctly assign tasks to team members whose skills and track match a particular task using task management tools like ClickUp, Trello, and Jira; everyone isn't expected to work on everything, just their own assigned tasks in the project.

Depending on the product you are building, you should assign the product designers to come up with the brand style guide while in communication with them. This guide contains the brand identity; logo, wordmark, product name, brand colors, typography, etc. Upon getting the brand style guide, the product designers can also begin working on the product wireframe.

You also need to ensure your engineers set up the repository (in the organization created on Github), web app codebase, and ci/cd based on if your architecture is monolith or microservices.

NB: Task management never stops throughout the sprint.

Day4: Comprehensive Documentation

You need to prepare your product requirement document(PRD). This is a comprehensive document that outlines the features, functionality, and user experience of your product and can be done on either GitBook, Notion, or even Google Docs. The PRD should detail the product vision, user persona, customer journey, user flow, features/benefits of a product, key performance indicators (KPIs) to the success of your product, and product roadmap.

Assign an engineering team lead to oversee the technical things. The engineers as well ought to outline their technical requirement document. The TRD serves as a blueprint for the technical implementation of the software project, defining the scope of the project, the architecture, the functionality, the design, and the technical requirements. It includes detailed information about the technical aspects of the project, such as hardware and software requirements, programming languages, frameworks, libraries, APIs, security, performance, scalability, and usability. This must be well done and about the PRD. It should contain the technical implementation and decisions on architecture, tech stacks, programming language, etc. They need to update the README (it should be used as the product guide/doc), and description of the repositories needs to be added.

Both the PRD and TRD ought to be regularly updated to ensure it contains up-to-date information.

Day5: Stand Up

Stand-up is an important meeting for teams that practice Agile methodology. The stand-up is a short meeting, typically no longer than 15 minutes, where team members gather together to discuss their progress, challenges, and plans for the day. This meeting should be held daily once the work is set in motion. It is important to have daily stand-up as it provides an opportunity for teammates to stay up-to-date on what everyone is working on and any issues that may be arising. It promotes collaboration, increases accountability, and increased transparency.

During each daily stand-up, you need to ensure all assigned tasks for that day have been completed. You can have this in the morning or evening, whichever is convenient for the team.

DAY6-8: Deliverables

Your product designers should have been done with the Hi-fi and Low-Fi Wireframes since yesterday. They should do a prototype of the wireframe design to see how the web app would look when finished.

The engineers ought to start coding these designs, especially the landing page and other sections of the web app using the wireframe as a guide. This should be deployed neatly. Ensure they fix any bugs in their code and clear all warnings.

They need to implement the UI of your main product during this time.

If other tasks were assigned as well, check in with the assignees to ensure that they deliver them on time.

DAY 9: Wrapping Up

At this time you should focus on core functionalities; every button of your product should work. Call your devs and let them show this to you.

Every other task assigned should be ready now or at least 90% ready.

Perform final testing and quality assurance checks. Conduct a user acceptance test to ensure the web app meets the requirements and objectives of the project.

Day10: Demo

Congratulations, You did it! You have your product but you need to demo it.

A demo is short for demonstration and is a presentation or display of how your product, service, or process works. It is often used to showcase a new product or feature to potential customers, investors, or stakeholders. Demos can be live, in-person presentations or they can be pre-recorded videos or webinars. The goal of a demo is to show the value of the product or service and to generate interest and excitement among potential users or customers.

In my case, it was a competition and all teams had to demo to our project coordinator.

During a demo, it is important to be clear, concise, and engaging. The presenter should focus on the most important features and benefits of the product or service and be prepared to answer questions and provide additional information as needed. A successful demo can lead to increased interest and adoption of the product or service, making it an important part of the marketing and sales process.

Disclaimer: I wrote this from my experience and it may not work this way for you but I hope it serves as a guide.