This lesson provides an overview of ALT 1: Interactive Information Systems.
You'll learn about the task, review relevant skills from previous modules, brainstorm ideas, form teams, and reflect on your approach. This should take about 120-180 minutes so you'll be working on this over a number of days according to your timetable.
ALT 1 focuses on creating an interactive information system, which is essentially a database-driven website or application that allows users to interact with data. For example, think of a system where users can add, view, update, or delete information, like a simple online library catalogue or a student grade tracker.
Before diving into ALT 1, let's review what you've learnt in prior modules. This will help you build on your existing skills.
From Introduction to Web Frontend: In this module, you learnt the fundamentals of building web pages that users can interact with directly in their browsers.
HTML forms the backbone by providing structure, allowing you to create essential elements such as headings, paragraphs, lists, and interactive forms for user input.
CSS enhances the visual appeal and usability by handling styling, including colours, fonts, layouts, and responsive designs that adapt to different screen sizes.
JavaScript brings interactivity to life, enabling features like dynamic form validation (e.g., checking if an email address is correctly formatted before submission), event handling (such as button clicks), and updating page content without needing to reload the entire page. For instance, you might have created a simple registration form that uses JavaScript to provide instant feedback on input errors.
From Python Web Backend: This module introduced you to server-side programming, where the magic of data processing and storage happens behind the scenes. You explored Flask, a flexible and lightweight web framework in Python, which allows you to build web applications efficiently.
Key skills included setting up routes to handle different types of HTTP requests (like GET for retrieving data and POST for submitting forms), rendering dynamic templates using Jinja2 to display data from the server, and integrating with databases for persistent storage.
With SQLite, a straightforward embedded database, you practised essential SQL operations: SELECT to query and retrieve specific data, INSERT to add new records, UPDATE to modify existing information, and DELETE to remove unwanted entries. For example, you could have built a basic web app that stores user-submitted notes in a database and displays them on a webpage, demonstrating how backend logic connects user actions to data management.
In ALT 1, you'll work in teams to design and build an interactive information system. This is essentially a web-based application that uses a database to manage and interact with data in meaningful ways. The artefact must include:
The system should solve a real-world problem, such as managing event registrations, tracking inventory in a small business, or organising a community library's book loans. It must be user-friendly, with intuitive navigation and clear layouts, and demonstrate good design principles like accessibility and responsiveness across devices.
You should follow structured stages to develop your project:
ALTs are team-based tasks, designed to encourage collaboration and allow you to combine your strengths with others. Teams should consist of 2-4 students, making it easier to divide tasks and share ideas effectively.
Instructions:
Now, apply what you've learned by brainstorming ideas for your artefact. Spend 20-30 minutes on this guided activity to generate creative and practical concepts for your interactive information system.
Step 1: Think of a real-world problem that could be solved with a database-driven website or app. Consider issues in your school, community, or personal life. Examples: A recipe sharing app where users can upload and browse recipes, a book review system for a school library, or a fitness tracker that logs workouts and progress.
Step 2: List key features that your system would need. Be specific about how it interacts with data. For a recipe app: Allow users to add recipes (storing details like ingredients and instructions in a database), search by category or ingredient, update existing recipes, and delete old ones. Think about additional features like user ratings or favourites.
Step 3: Sketch a simple wireframe on paper or digitally. Outline the main pages and user flow. Include elements like a home page with a search bar, an 'add item' form, a view list page with filters, and perhaps a user profile section. This helps visualise the interface early on.
Step 4: Consider what technologies you will use and why they fit. For example, HTML/CSS/JavaScript for the frontend to create responsive and interactive pages, Python with Flask for the backend to handle server logic and routes, and SQLite for the database to manage data storage and queries efficiently. Jot down any potential challenges, like integrating frontend validation with backend data submission.