16 computer science project ideas by level

Every CS course eventually arrives at the same moment: you've learned the syntax, you understand the theory, and now someone says 'just build something.' That gap between knowing and making can feel surprisingly wide.

That's where project-based work closes the distance. The right project teaches you things no lecture can, because it forces you to make decisions, hit real constraints, and debug your way to something that actually works. But picking the right project for where you are right now matters. A project that's too simple won't stretch you. One that's too complex will stall you before you get started.

These 16 computer science project ideas are organized by skill level, from beginner to advanced. Each one comes with a real Figma Community template so you can start with a working visual structure, not a blank screen.

Read on to learn:

• Which CS projects are best for beginners, intermediate builders, and advanced learners
• How Figma Make lets you turn a design into a working, interactive app
• Which real Figma Community templates fit each project type

What makes a good computer science project?

A good CS project does a few things at once. It gives you a real problem to solve, a set of constraints to work within, and a reason to care about the outcome. The best projects connect technical skills (data structures, APIs, UI logic) with something you'd actually want to use.

They're also shareable. Whether you're applying for internships, building a portfolio, or just showing your work to a friend, a project you can point to is worth more than ten assignments no one will ever see.

Here's how to think about the levels in this list: beginner projects are focused on getting something on screen and making it interactive. Intermediate projects introduce persistence, multiple views, and real data. Advanced projects tackle complexity, multiple users, integrations, and systems that have to scale.

You can start anywhere on this list. But if you're newer to building, beginning at the top will give you the fastest feedback loops and the most confidence to push further.

16 computer science project ideas (with templates)

Beginner projects

These five projects cover the fundamentals: CRUD operations, basic UI patterns, form handling, and layout. Each one is simple enough to finish in a weekend but teaches patterns you'll use in every project after.

1. Task manager

There's a reason task managers are a classic CS project. They touch everything. You've got a list of items that get created, updated, completed, and deleted. You need to think about state, persistence, and UI feedback all at once. Tell Figma Make you want a kanban board with three columns (To Do, In Progress, Done), cards you can drag between columns, and a form to add new tasks. Then start breaking it. Add due dates. Add filters. Add a search bar. Each feature you layer on teaches you something new about how UI and data interact.

Why it works: The kanban pattern maps directly to how state machines work, making it a great first encounter with the idea that UI is a function of data.

Template: Kanban Board Application by dimorin

2. Student dashboard

What does a student actually need to see when they log in? That's the question worth starting with. Course progress, upcoming deadlines, recent grades, a schedule for the week. Type something like 'a student dashboard with a sidebar nav, a course progress section, upcoming assignments, and a recent activity feed' into Figma Make and you'll have a solid starting point. Then replace the placeholder data with real information. Think about how a student's view would change depending on the time of day or week.

Why it works: Dashboards train you to think about information hierarchy, which is one of the most underrated skills in software development.

Template: Student Dashboard LMS Application by Sakshi Parashar

3. E-commerce storefront

Building a storefront teaches you more CS fundamentals than almost anything else at this level: product listing, filtering, a shopping cart, a checkout flow. Each screen introduces a new challenge. How do you keep the cart in sync across pages? How do you handle quantity changes? How do you show an empty state? Start with a product grid and a simple cart. Add categories and a filter sidebar. Then build the checkout form and a confirmation screen.

Why it works: E-commerce flows are everywhere, and every interaction (add to cart, remove item, apply coupon) is a mini state management exercise.

Template: Supermarketprotype by toroitich grace

4. Portfolio website

If you're going to spend time building something, it might as well be something you can show off. A portfolio website is a beginner project with a real-world payoff. You decide what to feature, how to describe your work, and how to make someone want to keep scrolling. Type something like 'a developer portfolio with a hero section, about me, project cards, and a contact section' into Figma Make and watch it assemble. Then personalize everything: swap in your own projects, your own color palette, your own copy.

Why it works: Personal projects sharpen decision-making because there's no brief to fall back on. Every choice is yours.

Template: Data Science Portfolio Website by siddhesh m

5. Contact form app

It sounds simple, but form handling is where a lot of real bugs live. Required fields, email validation, error states, success confirmations. Build a contact form that actually validates inputs before submitting, shows meaningful error messages, and confirms when the message is sent. Once you've got the basics, add a character counter on the message field. Add a CAPTCHA. Add a rate limit. Each addition gets you closer to production-quality thinking.

Why it works: Form validation is where frontend logic gets real. Getting it right teaches input sanitization, UX feedback loops, and defensive programming.

Template: Wireframe Contact Us Page by Ashfaque Shaikh

Intermediate projects

These six projects introduce real complexity: multi-screen flows, data persistence, external APIs, and user-specific state. They'll take longer to build, but finishing one of them is worth several beginner projects on a portfolio.

6. Chat/messaging app

Messaging apps look simple until you build one. Real-time updates, conversation threading, read receipts, user avatars, timestamps, message bubbles that switch sides depending on who's talking. Build the UI first in Figma Make, then wire in a real-time backend like Firebase or Supabase. Start with a two-person chat before you tackle group threads. Think about what happens when messages arrive while you're typing, when you scroll up to load history, or when someone's offline.

Why it works: Real-time UI forces you to think about optimistic updates, concurrency, and the gap between what the user sees and what's actually in the database.

Template: Réplica de WhatsApp Web (Copia) by Angel Pereyra

7. Inventory management system

Inventory systems are a great intermediate project because they combine a lot of moving parts: product records, stock levels, search and filter, bulk updates, and often some kind of reporting. Prompt Figma Make with a warehouse management interface that includes a product table, low-stock alerts, a search bar, and an add-product form. Then think about the edge cases: what happens when stock hits zero? How do you handle multiple warehouses? What does the audit trail look like?

Why it works: Inventory management introduces you to relational data, constraint logic (you can't have negative stock), and the importance of system state over individual actions.

Template: Web Inventory Management System by Nann

8. Admin dashboard

Every app eventually needs an admin side. Role-based access, user management, data tables with sorting and pagination, modals for editing records, bulk actions. This project teaches you to think about the same data from two perspectives: the end user who interacts with one piece at a time and the admin who needs to see everything at once. Build the core tables first. Then add filtering, then row-level actions, then bulk operations.

Why it works: Admin dashboards train you to think about permissions, data density, and the tradeoff between showing everything and showing what matters.

Template: Admin Dashboard Wireframe by Mahnoor

9. Event booking platform

Event platforms touch almost every major UI pattern: browsing a list, filtering by date and category, viewing a detail page, selecting seats or tickets, filling out a checkout form, and getting a confirmation. Each step in the flow has its own logic. What happens if two users try to book the last ticket at the same time? How do you show a sold-out state? How do you handle cancellations? Build the happy path first, then attack the edge cases.

Why it works: Multi-step booking flows teach you how to manage state across a sequence of screens, which is directly applicable to onboarding flows, checkout funnels, and any wizard-style UI.

Template: Event Management Website by rishikaaa02

10. Data analytics dashboard

You've probably worked with data in a spreadsheet. Now build the interface that makes that data legible to someone who doesn't want to open a spreadsheet. Start with a set of charts: a bar chart for monthly totals, a line chart for trends, a summary card for key metrics. Connect it to a real dataset (a CSV, a public API, or a mock database). Then add a date range filter and watch the charts respond. That moment when the data updates live is what makes dashboards satisfying to build.

Why it works: Data visualization projects teach you to separate data transformation from presentation logic, a pattern that appears everywhere in frontend and backend development.

Template: GraphQL Data Analytics File Upload Dashboard (Copy) by Daph

11. Real-time data visualizer

Take the dashboard idea further: build a visualizer that updates in real time. Stock prices, social media metrics, server load, weather data. The challenge here isn't the visualization itself, it's keeping the UI in sync with a live data stream without it feeling jittery or overwhelming. Prompt Figma Make with an animated data flow interface, then connect it to a WebSocket feed or a polling API. Think about how you handle data spikes, network interruptions, and the moment the stream goes quiet.

Why it works: Real-time visualizers teach WebSocket handling, throttling, and the UX patterns that prevent a live feed from feeling chaotic.

Template: Animated AI Data Flow Visualization by Aditya Kumar

Advanced projects

These five projects are for builders who are ready to work with complex data models, multi-user systems, third-party integrations, and production-level thinking. They're harder to finish, but each one produces something genuinely worth shipping.

12. Hospital management system

Few projects expose you to as many interlocking systems as a healthcare application. Patient records, appointment scheduling, doctor assignments, billing, and medical history all have to connect correctly, and the stakes for errors are unusually high. That makes it a serious technical and design challenge. Start by mapping the core entities: patients, doctors, appointments, departments. Then build the scheduling flow. Add patient intake forms. Add billing summaries. Think carefully about what information belongs on each screen and who should have access to it.

Why it works: Healthcare systems require you to handle sensitive data carefully, model complex relationships, and build UIs that work under real operational pressure.

Template: Hospital Management System by Shriram Gupta

13. IoT monitoring dashboard

IoT dashboards connect physical sensors to digital interfaces, and they introduce problems that most web apps don't face: intermittent connectivity, sensor drift, data from dozens of sources arriving at different intervals. Build a monitoring dashboard for a set of environmental sensors (temperature, humidity, water level). Display live readings, historical charts, and threshold alerts. Handle the case where a sensor goes offline. Think about what the 'normal' range looks like for each metric and how you communicate anomalies clearly.

Why it works: IoT projects build strong instincts around data pipelines, error states, and the gap between what a sensor reports and what a user needs to know.

Template: IoT Water Level Monitoring Flowchart (Copy) by Idris Ogundele

14. AI voice assistant app

Voice interfaces are one of the hardest things to get right in software. The input is ambiguous, the latency is noticeable, and the feedback loop is entirely different from a click-based UI. Build an app that accepts voice input, processes it through a language model, and responds in a way that feels natural. Think about how you handle partial transcriptions, how you show the assistant is 'thinking,' and how you surface responses that might be long or structured. Then consider what happens when the user asks something the model can't answer.

Why it works: Voice assistant projects sit at the intersection of speech-to-text, LLM integration, and conversational UX. Getting comfortable here prepares you for a growing category of product work.

Template: AI Voice Interaction App by Nessi.Huang

15. ERP system

Enterprise resource planning systems are what you build when you need to unify finance, operations, HR, and inventory under one roof. They're architecturally complex, data-heavy, and built for users who live in them all day. Start by scoping one module: finance or inventory, not both. Build the data model first, then the tables and forms. Add inter-module references (a purchase order that creates an inventory record, a payment that updates a ledger). Think carefully about loading states, empty states, and what happens when data is stale.

Why it works: ERP projects teach you how to architect systems where multiple domains share data without creating a tangled mess, a skill that translates directly to backend system design.

Template: Executive ERP Dashboard by Ana Miranda Tirado

16. Dev-ready design handoff

This one is different from the others. Instead of building a new app, you're taking an existing design and making it truly ready for engineering. That means annotated specs, design tokens, component documentation, interaction notes, and a thorough Dev Mode review. It's a project that teaches you how the design-to-development handoff actually works in professional teams, and it's one of the most portfolio-relevant things you can do if you're aiming at a product, design engineering, or full-stack role. Start with your own past project or an open-source design system.

Why it works: Handoff projects build fluency in the tools and language that bridge design and engineering, which makes you more effective in any collaborative product team.

Template: Ready for Dev Mode? by Kevin To

Five tips for CS project success

1. Start with the hard screen, not the easy one.

Most projects have one screen that makes or breaks the whole thing. For a chat app, it's the message thread. For an inventory system, it's the product table. Build that screen first. If it works, everything else will fall into place. If it doesn't, you'll know early.

2. Use real data from day one.

Placeholder text and dummy numbers hide bugs. As soon as you have a working screen, replace the fakes with real content, even if it's just your own data. Long strings break layouts. Edge cases appear. You'll catch more issues earlier.

3. Version your project, even if you're working alone.

Git isn't just for teams. Committing regularly means you can break things without fear. You'll also build the habit of writing commit messages that explain your thinking, which is genuinely useful when you come back to a project two months later.

4. Get it in front of someone else as fast as possible.

The faster you can put something in front of a real user, the faster you find out if your idea actually works. And every iteration you run is one fewer assumption you're carrying into the build. Show a rough version to a classmate. Ask someone to try to break it. Watch where they get confused.

5. Design and code together, not design then code.

The best projects evolve. Sketch the screen in Figma, build a rough version, notice what doesn't work, update the design, rebuild. That loop is where the learning happens. Tools like Figma Make make this loop faster because the distance between a visual idea and a working interface is much shorter than it used to be.

Start building with Figma

We hope this list gives you a project worth starting. Whether you're picking up your first build or looking for something that'll push you further, there's something here for every stage.

When you're ready to build, here's where we'd suggest starting:

• Prompt your way to a working app with Figma Make. Describe what you want, watch it assemble in real time, and connect it to real data.
• Build out your prototype visually in Figma Design. Sketch your screens, establish your component library, and get a clear picture of the product before you write a line of code.
• Map workflows and co-create with your team in FigJam. Use it to plan your architecture, sketch user flows, or run a quick retro after a build sprint.
• Present your work in Figma Slides. Show your project to a class, a hiring panel, or your team with slides that can pull live content directly from your Figma files.
• Find templates for every project type in the Figma Community. Every project on this list has a matched template to get you off a blank screen faster.

The best CS project is the one you finish. Start small, build consistently, and show your work.