{ Exam Project | Hand-in date: 26.05.2017 | Group hand-in, size of group:
}
2-4 people
Part 1: The Prototype Introduction of the assignment Your client is a company organizing tech-related events in Copenhagen on a regular basis. The company is both focused on attracting participants to these events, as well as on finding partners that are willing to sponsor the events or hold a presentation for an event. At the moment, your client company only uses Facebook events to reach their audience, but they realized that they need an independent web application where they can manage these events. Your task is to create a prototype, with a fully-designed interface, that will work as a proof of concept for your client, by incorporating the following functionalities given to you by the company’s members of the board: “As m embers of the board of ___1, we want to be able to: - login to the application as administrators and create accounts for potential future members of the board - post new events, delete and edit existing events, get an overview of all the events and see individual events - manage the partners list, in a similar way as with the events”
The company is still insecure about certain features that should be included in the final product, so another task that you have to do is to help them find out what these features could / should be. Come up with ideas of features that should be added in the final product and show how they would work in the prototype you are implementing. For example, it could be useful to include a calendar to keep track of the events, or perhaps a way of filtering events according to the topics presented, seats limitation on the different events according to the location capacity etc. 1
Extra requirement: find an appropriate name for your client company.
You are the ones to find out what the extra features should be, so you are in control over their implementation in the proof of concept. Technical requirements of the prototype: ○ In your solution, you must use the following: HTML, Sass, Javascript, Flexbox, SVG, CSS3 animations, transitions and transforms. ○ Your product will be used from multiple types of devices, among which laptop computers, tablets and mobile phones. Therefore, you must use media queries to implement a layout that will work on all devices. Implement a responsive or an adaptive layout. Argue for your choice and have in mind the difference between the two types of layout. ○ Optimize your final solution in terms of frontend performance. Non-technical requirements: ○ You should design a product that is useful, usable, efficient, effective and follows good design practices. ○ In terms of usability, make sure you account for usability principles in your interface. ○ Your design process should include the following: ■ Creating design goals and generating ideas: describe your analysis and thinking behind identifying user needs and what these user needs are. Take the identification of user needs further and create your design goals. The end result of this step should be your solution idea(s) for the extra features that the company wants you to help them with. ■ Create and provide low-fidelity prototypes, such as storyboards and wireframes, and write a description of what they represent and what you achieve with them. ■ Create and provide mockups of your interface, displaying the core features of the system you are prototyping. If you do not have the necessary resources to create full mockups, provide at least a style guide of your UI components’ visual styles. ■ Create and provide a high-fidelity and interactive prototype. Note that it doesn’t have to be the final version that you implemented, it can be a high-fidelity prototype you have developed in one of the prior iterations of your design process. ■ Include any testing you are conducting on your prototypes, what type of tests they are and what are the results.
Part 2: The Report The report should include: ○ Your Visual Design considerations: choice of colors, typography, images etc. Argue for your choices. ○ Your Information Architecture considerations: choice of layouts, navigation flow etc. Argue for your choices. ○ Your Interaction Design considerations: what interactions you have included, what do they consist of, how they take place, why you have included them etc. ○ Technical details about your implementation, such as: ■ Choice of targeted media for your solution and how you make sure your interface works on different screen sizes. Argumentation. ■ What technologies you are using and why (include also frameworks and libraries). Argumentation. ■ A detailed description of the optimization methods that you are implementing. Be very critical about every choice in your design; you should be able to argue for every single decision you make with regards to both design and choices of development methods and tools. Your hand-in includes both the prototype, which should fulfill the technical and non-technical requirements listed above, as well as the report, which should cover the points mentioned.
End note: You may draw some inspiration from http://foocafe.org/ to have an idea of what your fictitious client company could be like.