CHAPTER 4: METHODOLOGY

4.1 Task 1: Netflix Home Page

1) Design Phase

Wireframes and design layouts were created to visualise the structure and
aesthetics of the home page. Design considerations included optimal placement
of content, call-to-action elements, and a responsive layout to ensure a seamless
experience across various devices.

2) Development
The home page was implemented using HTML and CSS, adhering to the design
specifications. Responsive design principles were applied to guarantee a
consistent and visually appealing presentation on devices of different screen sizes.

3) Testing

Testing was conducted to verify the home page's functionality and appearance
across multiple sized devices. This phase involved identifying and addressing any
compatibility issues or visual discrepancies.

4) Refinement

Feedback from testing was gathered and used to refine the home page.
Adjustments were made to improve user experience, address any identified issues,
and enhance overall aesthetics. The iterative refinement process ensured a
polished final product.

4.2 Task 2: Temperature Converter App

1) Planning
The planning phase involved defining the app structure, identifying temperature
SI unit types, and outlining user interactions. Key considerations included the user
interface, scoring mechanism, and overall flow of the application.

12
2) Development of Core Functionality

JavaScript was employed to implement the converting logic, including different

parameters loading, user response evaluation, and calculation. The focus was on
creating a dynamic and engaging experience for users.

3) User Interface Design

HTML and CSS were used to create an intuitive and visually appealing
application interface. Design elements were crafted to enhance user engagement
and facilitate easy navigation through the converting app.

4) Testing

Thorough testing was conducted to ensure the converter app's functionality,

including accurate value, unit progression, and responsiveness. This phase
identified and resolved any bugs or usability issues.

5) Enhancements

Based on initial testing and feedback, additional features or improvements were

explored to enhance the overall user experience. This iterative approach aimed to
refine the app and address any user interface or functionality suggestions.

4.3 Task 3: Music Player System

1) Requirements Analysis
Identified user needs through interviews and surveys. Defined key features based
on user feedback.

2) Design Phase
Created wireframes and high-fidelity mock-ups for UI design. HTML Structure:
Implemented a clear and organised HTML structure.

13
3) CSS Styling

Ensured a visually pleasing and responsive layout.

4) JavaScript Functionality

Integrated play controls, playlist management, and audio API. Conducted rigorous
testing, including user testing.

5) Documentation

Documented code and created a comprehensive user guide.

6) Deployment
Choose a reliable hosting platform and configured domain settings.

7) Feedback and Iteration

Gathered user feedback post-deployment. Implemented iterative updates based on
user suggestions.

14