prifina / app-desktop Goto Github PK

View Code? Open in Web Editor NEW

2.0 2.0 8.0 31.9 MB

JavaScript 76.27% HTML 15.40% CSS 8.32%

app-desktop's People

Contributors

Stargazers

Watchers

Forkers

mmlampinen jmkim58 hamzahalilovic prabhnometery kahpong99 nicolaswg tomaszolek dylan-finney

app-desktop's Issues

Left-side Navigation Bar Label

**Side Menu Drawer Label**

Side Menu Drawer Labels: Connections, Events, Files...

Includes:

Relevant user story: User story

Visual component design: Figma file

Specifications:

Select Box(Dropdown)

Page Name: Console UI concept(1) (https://www.figma.com/file/liwrg2buYcx1qeBVNuxfQh/Prifina-UI-ReStyle-(Copy)?node-id=183%3A850)

Personal Cloud Service Option Box

Personal Cloud Service Container

Personal Cloud Service Container to be presented to the user on “Select Your Personal Cloud Service" -page, that is shown to the user after the registration User Story, where user is presented, and where user can compare provided cloud service options

Includes: "Select Button", Text Labels

Relevant user story: User story

Visual component design: Figma file

Specifications:

Note

Note in the form

The form has predefined fields to help the user fill out their information quicker. There is also a note to the user mentioning that they can auto populate this information by connecting various data sources (e.g. Facebook, LinkedIn, Google).

Includes: Text Field

Relevant user story: https://docs.google.com/document/d/1J5iiOgJnjcFXOFnN11Ra7lGb-JSI9clSLA899GNJC3o/edit#
Visual component design: https://www.figma.com/file/9z7bqVLQmFmas2OsNUIAn6/Prifina-Core-Navigation-(Copy)?node-id=957%3A4044
Specifications:

Progress Bar

Progress Bar

There is an anchored progress that allows the user to see the file upload process (e.g. duration, how much of the file has uploaded). During this upload the user can continue to do other tasks and return to this progress bar.

Includes: Progress bar

Relevant user story: https://docs.google.com/document/d/12GXNUdyK75S2Kdvh-wN2kQ6SBNJj5bIZpWDn-8Xkc6s/edit
Visual component design: https://www.figma.com/file/9z7bqVLQmFmas2OsNUIAn6/Prifina-Core-Navigation-(Copy)?node-id=957%3A4044

Specifications:

Notification Card

Notification Card

They are shown a ‘notification indicator’ for one new notification, on top of their avatar, for the first notification message.

User chooses where they will navigate next

The user can choose to open a preinstalled application, view notification(s), modify account settings...

Includes:

Relevant user story: User Story

Visual component design: Figma file

Specifications:

HTML Template for System Messages

Create HTML template of the attached message, including Base64 encoding of the image(s) used.

Password Reset Page

Password Reset React Page

Create Password Reset React Page

This is a page for user password reset.
This includes five form components with username, email, email verification, password reset, reset confirm components.
Each components were built with React function using React material UI.

Includes Components: Email.js / VerificationEmail.js / NewPassword.js / ResetConfirm.js / ResetDescription.js

Storybook draft documentation: https://docs.google.com/document/d/1LYFpVsRkH5VCHaCqYnYTzr0swspxngJaQov4qQTbYOg/edit

Visual component design: "Password Reset"
https://www.figma.com/file/fS9gcgUb0KShgtZ3XIYQqY/Production-Version-Software-Development?node-id=869%3A0

public documentation pages for Personal data cloud data model

More details here: https://whimsical.com/PJACqp6bM9KyVpgQ64Tyy2

Left-side Navigation Bar Link

Side Menu Drawer Back To Home Button

Includes: Button with text and icon

Relevant user story: User story

Visual component design: Figma file

Specifications:

Personal Cloud Service Terms Text Component

Personal Cloud Service Terms Text Component

Personal Cloud Service Terms Text

Includes: Text Labels

Relevant user story: https://docs.google.com/document/d/148Oh7AnmXeJ-IBpVWqSGH7jgRo9wNLOjXBnUXeJ9tvg/edit?ts=5f87335e#heading=h.o6do42inilxx
Visual component design: https://www.figma.com/file/fS9gcgUb0KShgtZ3XIYQqY/Production-Version-Software-Development?node-id=1686%3A15551
Specifications:

Input Form Field

Console Landing Page Prompt Component

The form has predefined fields to help the user fill out their information quicker. There is also a note to the user mentioning that they can auto populate this information by connecting various data sources (e.g. Facebook, LinkedIn, Google).

Includes: Input Field, Note

Data Sources Platform Icon/Text Field

Data Sources Platform Icon/Text Field

Should it have Icons of the Platforms or just Names in Text Field ?

On top of being able to see what the user has connected to, they should be shown the option to disconnect their data source(s).
Includes: Text Fields, Icon

Relevant user story: https://docs.google.com/document/d/1Uy4hmT6uwvXpjJnWD-QS7hkNKKU2mf-eYmjh1av-uzA/edit#heading=h.8fod4q1wptal
Visual component design: https://www.figma.com/file/9z7bqVLQmFmas2OsNUIAn6/Prifina-Core-Navigation-(Copy)?node-id=957%3A4044
Specifications:

Version 0.1 of personal data cloud data model UML

UML visualisation using whimsical:
https://whimsical.com/LCvJJ4qz3N1og9Rk9CGiXW

Password Reset Page Building

Documented details of Version 0.1 personal data cloud data model

Using spreadsheet here:
https://docs.google.com/spreadsheets/d/1T-_2kQ7Yh7bYdSEp93UnZCa0AhbUvaxGk3r3dyDRYz8/edit#gid=1295625713

Table View

Page Name: Console UI concept(1) (https://www.figma.com/file/liwrg2buYcx1qeBVNuxfQh/Prifina-UI-ReStyle-(Copy)?node-id=183%3A850)

Left-side Navigation Bar Icon

**Left-side Navigation Bar Icon**

Left-side Navigation Bar icons : Prifina, Dashboard, Cloud, Search

Includes:

Relevant user story: User story

Visual component design: Figma file

Specifications:

Search InputBox

Page Name: Console UI concept(1) (https://www.figma.com/file/liwrg2buYcx1qeBVNuxfQh/Prifina-UI-ReStyle-(Copy)?node-id=183%3A850)

Application Icon

Application Icon

Home Screen Icons (Data Console, Account Settings...) that also can appear in other places like User Menu/Recent apps

Includes:

Relevant user story: User Story

Visual component design: Figma file

Specifications:

Left-side Navigation Bar Icons

**Side Menu Drawer Icons**

Side Menu Drawer Icons

Includes: Prifina, Cloud, Search, Dashboard* Icons...

Specifications:

Personal Cloud Service Page

Personal Cloud Service Page

Includes: Text Fields, Personal Cloud Service Option Containers

Relevant user story: User story

Visual component design: Figma file

Specifications:

App Button Color

Page Name: Console UI concept(1) (https://www.figma.com/file/liwrg2buYcx1qeBVNuxfQh/Prifina-UI-ReStyle-(Copy)?node-id=183%3A850)

App title is missing

Prifina Alpha App - Liberty. Equality. Data.

Right Side Complete Section

Page Name: Console UI concept(1) (https://www.figma.com/file/liwrg2buYcx1qeBVNuxfQh/Prifina-UI-ReStyle-(Copy)?node-id=183%3A850)

App description fields missing

Should be:

"site description"= The first and only platform to build personal apps where data and apps are separated. Users retain control of their data.

"meta keywords"= data, api, personal data, personal apps, privacy, gdpr, ccpa,

Browse Apps Back Link

Page Name : Dashboard UI Concept (1) (https://www.figma.com/file/liwrg2buYcx1qeBVNuxfQh/Prifina-UI-ReStyle-(Copy)?node-id=183%3A700)

Console Landing Page Prompt Button

Console Landing Page Prompt Buttons

The form doesn’t have to be filled out in one sitting: The user can save the form and return to it later. In the initial form screen, there are 3 tabs that indicate the various progress levels of forms. The 3 tabs are: new forms, in progress forms, and completed forms.

Includes: Save Button