Difference between revisions of "HSK"
(→Architecture) (Tag: Visual edit) |
|||
(11 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
== Group members == | == Group members == | ||
+ | |||
+ | Henrik Østgaard (henriost@student.matnat.uio.no) | ||
Sindre Grønmyr (sindrgr@student.matnat.uio.no) | Sindre Grønmyr (sindrgr@student.matnat.uio.no) | ||
− | |||
− | |||
Kenneth Madsen (kennethmad@student.matnat.uio.no) | Kenneth Madsen (kennethmad@student.matnat.uio.no) | ||
− | == Product descriptions | + | == Product descriptions == |
We have chosen to develop the [[Master Facility List]]. | We have chosen to develop the [[Master Facility List]]. | ||
− | |||
− | * Search functionality | + | ===Requirements=== |
− | * A view of a specific unit or set of | + | |
− | * | + | The main user requirements are: |
+ | * The user should be able to search for an organisation unit by name. | ||
+ | * The user should be able to filter organisation unit based on memberships in organisation unit groups. | ||
+ | * When the user clicks on a organisation unit, information associated with this organisation unit should be displayed. | ||
+ | * The user should be able to propose changes to the information displayed for a organisation unit. | ||
+ | * A user with the appropriate user roles should be able to open a list with all proposed changes. | ||
+ | |||
+ | In summary we will be implementing: | ||
+ | |||
+ | * Search functionality with filtering for organisation unit groups. | ||
+ | * A view of a specific unit or set of organisation units with position on map and all relevant info relating to that unit. | ||
+ | * Possibility for users to suggest changes to units at all levels. | ||
+ | * If a user is an admin, he/she should be able to see the suggestions, and possibly delete them, if wanted. | ||
+ | |||
+ | ===Early design=== | ||
+ | Based on the above requirements we started to experiment with different designs. After some paper mock-ups we started to agree on a basic layout of our app. | ||
+ | The figure below is one of our first mock-ups that became the foundation for our app. | ||
+ | |||
+ | [[File:hsk-wireframe.png|700px]] | ||
+ | |||
+ | ===Finished product=== | ||
+ | As illustrated in the figure underneath the underlying idea of the user interface was kept through the project. Naturally there has been some changes through the process both in terms of requirements and design, but the basic layout is quite similar to what we had in mind from the start. | ||
+ | |||
+ | [[File:Hsk-search-filtering.png|700px]] | ||
− | |||
== Architecture == | == Architecture == | ||
We will be using React with the help of: | We will be using React with the help of: | ||
− | * [https://material-ui-next.com/ Material UI next] | + | * [https://material-ui-next.com/ Material UI next] (Pre-released, beta) |
* Material UI | * Material UI | ||
− | We believe that by keeping as close as possible to DHIS2 in what design and framework we use we can keep the same feeling in UI/ usage and development of the web app. | + | There was several reasons for choosing React as our front end library: |
+ | * It aims to provide simplicity, speed and scalability, which is all desirable non-functional requirements for a web app. | ||
+ | * Good availability of learning resources for beginners. | ||
+ | * It has a big user community which. | ||
+ | |||
+ | The reason we chose to incorporate Material-UI components into our app was to archive a uniform interface based on well defined design principles. We had also noticed that some of the apps already available in DHIS2 also used React and Material-UI. We believe that by keeping as close as possible to DHIS2 in what design and framework we use we can keep the same feeling in UI/ usage and development of the web app. | ||
+ | |||
+ | |||
== Licensing == | == Licensing == | ||
+ | Our webapp is licensed under the [https://opensource.org/licenses/MIT MIT] license. All frameworks and libraries used to develop the webapp is also licensed under MIT, so this was a natural choice. | ||
− | + | == Division of labour == | |
− | == | + | ==== Henrik ==== |
− | + | *Filter and search, wiki page, presentation, testing and fixing, build and installation into DHIS2 | |
+ | |||
+ | ==== Sindre ==== | ||
+ | *Filter and search, proposing changes, view of proposes for admins, wiki page, testing and fixing | ||
+ | |||
+ | ==== Kenneth ==== | ||
+ | *Basic structure of code, search, views of units, maps, proposing changes, wiki page, testing and fixing | ||
== Timeline == | == Timeline == | ||
+ | This is a rough schedule of how we plan to set up the project work: | ||
+ | |||
=== Week 43 === | === Week 43 === | ||
* Write the wiki page | * Write the wiki page |
Latest revision as of 03:39, 7 December 2017
Contents
Group members
Henrik Østgaard (henriost@student.matnat.uio.no)
Sindre Grønmyr (sindrgr@student.matnat.uio.no)
Kenneth Madsen (kennethmad@student.matnat.uio.no)
Product descriptions
We have chosen to develop the Master Facility List.
Requirements
The main user requirements are:
- The user should be able to search for an organisation unit by name.
- The user should be able to filter organisation unit based on memberships in organisation unit groups.
- When the user clicks on a organisation unit, information associated with this organisation unit should be displayed.
- The user should be able to propose changes to the information displayed for a organisation unit.
- A user with the appropriate user roles should be able to open a list with all proposed changes.
In summary we will be implementing:
- Search functionality with filtering for organisation unit groups.
- A view of a specific unit or set of organisation units with position on map and all relevant info relating to that unit.
- Possibility for users to suggest changes to units at all levels.
- If a user is an admin, he/she should be able to see the suggestions, and possibly delete them, if wanted.
Early design
Based on the above requirements we started to experiment with different designs. After some paper mock-ups we started to agree on a basic layout of our app. The figure below is one of our first mock-ups that became the foundation for our app.
Finished product
As illustrated in the figure underneath the underlying idea of the user interface was kept through the project. Naturally there has been some changes through the process both in terms of requirements and design, but the basic layout is quite similar to what we had in mind from the start.
Architecture
We will be using React with the help of:
- Material UI next (Pre-released, beta)
- Material UI
There was several reasons for choosing React as our front end library:
- It aims to provide simplicity, speed and scalability, which is all desirable non-functional requirements for a web app.
- Good availability of learning resources for beginners.
- It has a big user community which.
The reason we chose to incorporate Material-UI components into our app was to archive a uniform interface based on well defined design principles. We had also noticed that some of the apps already available in DHIS2 also used React and Material-UI. We believe that by keeping as close as possible to DHIS2 in what design and framework we use we can keep the same feeling in UI/ usage and development of the web app.
Licensing
Our webapp is licensed under the MIT license. All frameworks and libraries used to develop the webapp is also licensed under MIT, so this was a natural choice.
Division of labour
Henrik
- Filter and search, wiki page, presentation, testing and fixing, build and installation into DHIS2
Sindre
- Filter and search, proposing changes, view of proposes for admins, wiki page, testing and fixing
Kenneth
- Basic structure of code, search, views of units, maps, proposing changes, wiki page, testing and fixing
Timeline
This is a rough schedule of how we plan to set up the project work:
Week 43
- Write the wiki page
- Establish requirements
- Get familiar with DHIS2 api
- Implement a simple React app
- Make and setup repository
Week 44
- Start to implement the app
- Interaction with the DHIS2 api
Week 45
- MILESTONE: Basic search and filtering functionality
Week 46
- Implement different views (groups, group sets)
Week 47
- Polish user interface
- Bug fixes
Week 48
- Finished product