Design Your Own App/web
Design your own simple app or website using paper prototypes and block coding; plan screens, add buttons, and test ideas with friends.
Step-by-step guide to design your own app or website
Learn HTML for Beginners - W3Schools.com
Step 1
Choose a fun app or website idea and write one short sentence that says what it does.
Step 2
Decide who will use your app and write their name or age next to your idea.
Step 3
Make a quick list of the main screens your app needs and write each screen name on the top of a separate paper.
Step 4
Draw the first screen on one paper with a big title and one main picture.
Step 5
Draw the other screens on their papers showing where pictures and text will go.
Step 6
Add buttons on each drawn screen and label each button with what it should do.
Step 7
Use sticky notes or arrows to show which button goes to which screen.
Step 8
Tape the pages together so you can flip from screen to screen like a real app.
Step 9
Ask a friend to try tapping the buttons while you change the pages to match their taps.
Step 10
Write down two things to change from the test and mark them on your paper screens.
Step 11
Open a block-coding tool (like Scratch) and start a new project to turn your paper screens into digital screens.
Step 12
Create each screen in the tool and add a button sprite that you program with blocks to switch screens when clicked.
Step 13
Test your interactive app in the tool, fix any bugs you find, and then share your finished creation on DIY.org
Final steps
You're almost there! Complete all the steps, bring your creation to life, post it, and conquer the challenge!
Help!?
What can we use if we don't have sticky notes or tape to show button links and attach pages?
If you don't have sticky notes or tape, use index cards or cut paper tabs for arrows and fasten pages together with binder clips, staples, or a glue stick so you can still 'tape the pages together' and flip screens.
My button sprite in the block-coding tool doesn't switch screens when clicked—what should I check?
If a button sprite doesn't switch screens, verify you recreated each paper screen as a Scratch backdrop or sprite and use a 'when this sprite clicked' block to broadcast a message or switch backdrop while ensuring no hidden sprites are covering the button.
How can we adapt the activity for different age groups?
For younger kids (4–6) simplify to 2–3 paper screens with a big title and one main picture and have an adult convert them into backdrops, while older kids (9–12+) can add more screens, complex button logic, variables, and lists when creating button sprites in Scratch.
How can we extend or personalize our app project after testing and fixing bugs?
To enhance your app, customize drawn screens with unique colors and characters, add sound effects and sprite animations using 'play sound' and 'switch costume' blocks for each button sprite, then retest and share the finished creation on DIY.org.
Watch videos on how to design your own app or website
Build a FREE Website with Google Sites
4 Videos
Build a FREE Website with Google Sites
How to Make an App for Beginners (2020) - Lesson 1
HTML Tutorial - How to Make a Super Simple Website
How to Make an App in 8 Days (2025 Full Tutorial)
Facts about app and web design for kids
✂️ Paper prototyping lets teams sketch and test whole app screens in minutes — no code required.
🧩 Block-based coding (like Scratch) uses puzzle-like blocks so beginners learn programming logic without typing syntax.
👥 Testing with just 5 users often uncovers the majority of common usability problems — small tests are powerful.
🖥️ The Apple App Store launched in 2008 with about 500 apps available on day one.
🗺️ Wireframes are simple blueprints that show layout and navigation, not final colors or artwork.
How do I guide my child to design a simple app or website using paper prototypes and block coding?
What materials do we need to design a paper prototype and then build it with block coding?
What ages is designing a paper prototype and using block coding suitable for?
What are the benefits of making paper prototypes and learning block coding with friends?
Make things. Learn new skills. Share safely.
DIY is a creative community where kids draw, build, explore ideas, and share what they make, all in a safe, moderated space.
Only $0 after trial. No credit card required