inovex / scrumlr.io Goto Github PK

As a first time user or website visitor I want to get to learn about Scrumlr and the feature list of the tool.

Content

• Name & logo of the tool and short description (e.g. "Collaborative online retrospectives")
• Overview of (unique) product features
  • 1-Click Board creation / join
  • No registration required
  • Shared screen / simultaneous edit
  • Guided mode
    • Phases
    • Focus cards
  • Votes
  • Secure after #8 and #9
  • Print version (CSS) of board available, e.g. for PDF creation
  • Responsive
• Legal notices

To be discussed

• Scroll effects / animations?
• Testimonials?
• ...

Examples

I personally like the homepage of InVsion:

The edit backdrop looks buggy on mobile

position: fixed is not working if one of the parent elements has a transform op. The mobile version of the columns has transform applied so that one can slide through the columns.

Marking ready needs two taps on mobile

... timer can be renewed (configurable duration)

• Delete "v2" branch
• Move current "master" to tagged name
• Set "v2.0" as the new master branch
• Write README.md and add link to current live version

So you are in a Slack channel and have the spontaneous idea for a lean coffee or a retrospective or a desire to create a Scrumlr Board for a certain meeting, let me introduce to you: /scrumlr

/scrumlr start leancoffee Brainstorming ideas for Scrumlr Slackbot
/scrumlr start simpleretro Retro Sprint 47
/scrumlr start startstopcontinue Retro Sprint 48
/scrumlr start kalm Starfish Feedback Max Mustermann
/scrumlr start madsadglad Team-Retro for incident 911
/scrumlr remind

[optional - maybe step 2]
/scrumlr list - active Scrumlr boards of the current user
-- maybe one can delete boards/entries from that list
/scrumlr start leancoffee - notice no name is supplied, use the current channel name as the board's name

A limit for user votes can be set for the whole board or per column.

If we use a Node.js webserver for our Docker image (e.g. express) all config properties in src/config.ts can be set dynamically at runtime and can be changed without a build. This will allow the execution of the app within a private network.

Currently, all resources are hosted statically with the help of a NGINX server within the docker container.

Left/Right-Arrows can be used to navigate between cards in a stack in the focus mode. Right now only the Up/Down-Arrows navigate through different stacks.

As a board owner I want to verify a user before he or she joins the board. An unaccepted user may not see the board data (secured by a firebase rule).

When a user wants to join a board, he will remain on a loading screen while he is not accepted by the board owner.

The board owner must be prompted and accept or decline the user join request.

Watching /presence in Board.tsx will lead to problems when many users are connected to the app. This should be moved within a smaller scope (e.g. a specific board)

The user reference is not removed in /presence when user logs out.

All mandatory legal notices must be added.

• Reachable from every site
• Reachable with at most 2-clicks
• Reachable via text-links in the same language as the website (Images are not allowed for a11y reasons)
• Reachable without necessity for JavaScript (not important without SSR)

Mandatory

• Imprint
  • Full name & address
  • E-Mail & Tel.
• Privacy policy / Data protection notice
  • "Who receives the collected information", "Information about third-party sites that might collect information": Analytics
  • Purpose of data collections
  • List of recipients (countries)
  • Information about Cookies
• Terms and Conditions of Use
  • "How to credit content and images from the site"
  • ...

Optional

• Copyright Notices on third-party content (if present)
• Disclaimer (if external links are present)
• Cookie consent

Examples

Sources

• https://www.lifewire.com/legal-pages-for-websites-3468973
• http://ec.europa.eu/ipg/basics/legal/index_en.htm
• https://www.ihk-wiesbaden.de/recht/rechtsberatung/Internetrecht-und-Werbung/Internetauftritt_Rechtliche_Anforderungen_und_Pflichten/1255572

When the timer expires it should make a sound that is short and recognizable but not too obnoxious (e.g. a bell or gong sound).

"Getting started" guides instead of regular splash screens for board admins

• Respect accessible color contrasts (WCAG AA)
  • 3:1 contrast ratio for font-size >18pt
  • 4,5:1 contrast ratio for font-size <=18pt

Contrast calculator / checker: https://snook.ca/technical/colour_contrast/colour.html#fg=33FF33,bg=333333
Examples: http://clrs.cc/a11y/

Hover on the icon of a user doesn't work. The name displays only on the frame.

When I add an card during the presentation of the cards at the first step, my card is added to the top. And because we present the cards from top to bottom my card is not anymore presented.

If my card would be added to the bottom, it would be presented like I added it in time.

Create firebase projects for DEV & STAGING

• Share credentials with all contributors

Add cron that cleans up firebase database.
The process should not affect any current sessions

When in a remote meeting with a shared screen I was able to see that the countdown times were different for the presenter and my local machine.

Due to restrictions I cannot upload a screenshot of the meeting.

• My browser displayed: 4:55
• Presenter's browser displayed: 3:44

Send link to force admin rights

Users are usually are not aware how and where cards can be dragged & dropped. Availbility must be highlighted

QR code should be larger (for usage in meeting rooms)

Opening a non-existing board (deleted?) board will lead to following error and the user will be stuck on the loading screen.

console.js:35 TypeError: Cannot read property 'filter' of undefined
    at t.render (ColumnView.tsx:94)
    at s (react-dom.production.min.js:130)
    at beginWork (react-dom.production.min.js:133)
    at o (react-dom.production.min.js:161)
    at a (react-dom.production.min.js:161)
    at u (react-dom.production.min.js:162)
    at _ (react-dom.production.min.js:169)
    at w (react-dom.production.min.js:168)
    at h (react-dom.production.min.js:167)
    at p (react-dom.production.min.js:165)
    at Object.enqueueSetState (react-dom.production.min.js:108)
    at l.o.setState (react.production.min.js:12)
    at l.onStateChange (connectAdvanced.js:205)
    at Object.l [as dispatch] (createStore.js:172)
    at Object.dispatch (<anonymous>:1:38399)
    at dispatch (<anonymous>:1:27776)
    at Board.container.tsx:235

Input of : will open suggestion / autocompletion list for Emoji's

As a user I want to keep my retro secret. The card text must be encrypted (e.g. with AES256) and the encryption key should be generated on the client and shared via the board URL (e.g. as a hash parameter).

The phase splash carousel isn't display correctly on narrow (mobile) screens. The width calculation seems to messed up and a width of 88px is set inline on the carousel container. Maybe it's a react-swipe issue?

It would be cool if you could scale the font size while focusing a card.

Problem:
I cannot see the whole text of my focused card. No way to scroll etc.

Expected output:
I can see the whole text of a card or have any other way to see the text.

Users (board admins) usually are not aware of the focus mode. It should be highlighted in a different way

When stacking cards, I would like for an option to unstack a card so it stands as a single card again

Thank you very much and keep up the good work

At the moment the board modes can be selected via a dropdown on the homepage. It would be better to introduce an intermediate mode selection screen for following reasons:

• Paging through different board modes
• Board modes / use cases can be explained
• Extended board settings can be made available on this intermediate screen

• Reduces layout complexity
• Fixes bugs (especially visibility on IOS)

The "background triangle" is very flat on a mobile landscape screen in focus mode. Maybe a redesign is necessary here?

The Admin can define multiple swimlanes with a header.
New cards will be added only to the first column (=backlog).

During the session the users drag&drop the cards between the swimlanes.

Optional: Cards have a counter that increases everytime they are rearranged.
Optional: Once cards are moved outside the backlog they can be rearranged only once. Another move will automatically put them into a special "conflict" column.

.. e.g. Depfu.com

We are a group of ~ 20 people. We added cards and were about to vote. Then suddenly everybody only got a blank white page.
MY dev console in chrome shows me this when I F5:

Uncaught TypeError: Cannot read property 'type' of undefined
at Function.t.mapStateToProps [as mapToProps] (ColumnView.container.ts:25)
at r (wrapMapToProps.js:41)
at Function.r.mapToProps (wrapMapToProps.js:50)
at r (wrapMapToProps.js:41)
at selectorFactory.js:22
at Object.run (connectAdvanced.js:21)
at s.u.initSelector (connectAdvanced.js:180)
at new Connect(t) (connectAdvanced.js:118)
at ji (react-dom.production.min.js:2904)
at so (react-dom.production.min.js:3397)
at po (react-dom.production.min.js:3583)
at Ko (react-dom.production.min.js:4646)
at Yo (react-dom.production.min.js:4667)
at Ra (react-dom.production.min.js:5055)
at ka (react-dom.production.min.js:5022)
at Oa (react-dom.production.min.js:4957)
at Zo (react-dom.production.min.js:4883)
at Object.enqueueSetState (react-dom.production.min.js:2867)
at s.w.setState (react.production.min.js:72)
at s.u.onStateChange (connectAdvanced.js:205)
at y (redux.js:213)
at query.js:121
at index.cjs.js:5271
at B (index.cjs.js:798)
at t.raise (index.cjs.js:10985)
at t.raiseQueuedEventsMatchingPredicate_ (index.cjs.js:10925)
at t.raiseEventsForChangedPath (index.cjs.js:10904)
at t.onDataUpdate_ (index.cjs.js:14598)
at e.onDataPush_ (index.cjs.js:13784)
at e.onDataMessage_ (index.cjs.js:13776)
at t.onDataMessage_ (index.cjs.js:12902)
at t.onPrimaryMessageReceived_ (index.cjs.js:12895)
at t.onMessage (index.cjs.js:12774)
at t.appendFrame_ (index.cjs.js:12304)
at t.handleIncomingFrame (index.cjs.js:12359)
at WebSocket.mySock.onmessage (index.cjs.js:12237)

Our board link is: https://scrumlr.io/#/board/-M3yjo2tFd47wB8FSgFV

Replace Less by Sass or an CSS-in-JS framework.

The less compilation is pretty slow and a lot of rules can be cleaned up upon migration.

The user list was not coolapsing correctly for 15 users on desktop screen

Gemnasium was used as a dependency version checker but it was acquired by GitLab and closed. It should be replaced by a good alternative.

Board columns or even modes (phases etc.) can be customized

Upgraded deprecated animation library

Some users would like to add the option for a happiness vote on some convenient value range (1-5/1-10).

Show the user icon or the name of the card author on the cards.
This is optional and should be configurable within the settings.

Related to #56 define a first set of available board modes.