Cinebase
App
1 Feb – 28 May 2019
The educational goals of this project were to achieve knowledge and experience with the development of databases and complex software systems. The purpose was to understand and explain the practical application of theories, concepts, and methods in the field of database development, as well as object oriented analysis and design, and object oriented programming. Based on this the project concerned the development of a movie review and information smartphone application called Cinebase, which had to communicate with two different databases, one made for the project and another external database for movie information. The main focus of the development was to make a visually appealing graphical user interface and create a fully functional application where the communication between the two databases worked seamlessly.
Process
Object Oriented Analysis & Design formed the foundation of the projects analysis and development. This method is concerned with finding system requirements including the functionality, architecture, and component design. This approach was beneficial for this project since it is entered around development which was the primary purpose of the project. Through the use of the method the necessary classes were defined before the programming of the system even started. Furthermore the functions of the system were defined before programming and the architecture of the system could be researched throughly before any coding took place.
Cinebase was developed using Flutter where I had the role of the primary developer. Cloud Firestore was used as a database to store application specific information and The Movie Database was used to fetch information about the movies. The application was developed using the state management package called scoped models, which was the newest and most popular state management solution at the time of the project. Furthermore a layered code architecture was used to allow for seperation of concerns.
An heuristic inspection of the application was performed, in order to evaluate the interface and find usability problems. A heuristic inspection was chosen instead of a usability study with test users, because a usability study with users requires a lot of time, facilities and resources in order to complete which the project didn’t have time for before the project period ended.
Design
While the project wasn’t focused on design and the aesthetics of the system, my group still decided to aim for developing a well-designed and user friendly application with a pleasing interfacedesign. Because interface design wasn’t a focus for the semester, users were not involved in the designproces, and the design of the application was based purely on the opinions of the designers, as well as on various design principles, such as the law of similarity and the law of proximity. A list of requirements was defined based on the wishes of the designers as well as research of similar existing applications. These requirements where then categorised using the MoSCoW method, in order to define which requirements were “must have,” “should have,” “could have,” and “want to have”.
From the list of requirements a sketching phase started, which was followed by a wireframing phase, which had the purpose of exploring possible interface designs. The color theme of Cinebase was made up of a dark theme based on Material Design, supplemented with a main pink color and a lighter pink accent color. The dark theming was chosen to give the user a pleasant experience using the app, without irritating the eyes, as well as to highlight the movie posters in the application. The pink colours were chosen because they contrasted the dark theme well, and distinguished Cinebase from similar systems.
The idea of the button and icon types used in Cinebase was to make them recognisable and understandable, in order to avoid a high learning curve when using the system for the first time. The icons used were a part of the Material Design theme, which made it more likely that the user recognised the design and meaning of each icon, since these are also used in other systems which relates to Jakob’s Law.
Gallery
This section provides images related to this project, such as sketches, wireframes, screenshots and similar. Click on an image to view the full size.