patternfly-design icon indicating copy to clipboard operation
patternfly-design copied to clipboard

Published 20 hours ago • verified publisher icon patternfly

Add onboarding card pattern

Open bmignano opened this issue 2 years ago • 2 comments

Requesting new features, enhancements, or design changes to PatternFly

New feature request for an onboarding pattern. Today, I don't think we don't have any formal onboarding experience across products. This feature could also be a variation of / enhancement to the card component, but with additional specific guidelines regarding when to use it, where, content, etc. App Studio would like to use this pattern—ACM also has something similar today and CNV is looking into a similar pattern.

WIP design: app-view-card

  • The onboarding card can be used for day one getting started / onboarding help, or as a new feature highlight
  • It will contain high level introductory information and an accompanying illustration
  • The card is dismissible and cannot be reinvoked by the user
  • The experience is per user

Questions to consider:

  • If the user doesn't dismiss it, does it finally go away on its own after a set period of time?
  • Should we have modal / carousel versions of this design?
  • Is there ever a CTA in the card?

Modal option mvp-part2 mvp-part2

Carousel option mvp-part2 copy

bmignano avatar May 04 '22 14:05 bmignano

@mcarrano Brie created this doc to document this: https://docs.google.com/document/d/1ugeSwI9t7iJ7HyQxuMhqCocWnI5okXGVZv5eARyP1Yc/edit#

If I remember correctly, the plan was to share this doc out to get feedback on which approach we should take to determine what to implement.

I'm wondering if we should send this out as an email, or share it in the general channel for people to give feedback in their own time, and then maybe share it at design share if we didn't get enough feedback by the time we have the next one. What do you think?

mmenestr avatar May 27 '22 18:05 mmenestr

I suggest sending somethings out on Slack - the PF design channel, general channel in UXD or both - requesting feedback. Then maybe put this on the agenda at the next design share meeting.

mcarrano avatar May 27 '22 20:05 mcarrano

@zhenpesky I'm assigning this issue out to you per out discussion yesterday. Feel free to add updates here as you work on this. Thanks for taking this on.

mcarrano avatar Nov 01 '22 15:11 mcarrano

@mcarrano here is the updated link to the work.

zhenpesky avatar Mar 22 '23 17:03 zhenpesky

@zhenpesky what's the latest on this?

mcarrano avatar Apr 20 '23 17:04 mcarrano

@mcarrano I updated the document with the consolidated patterns with some guidelines and use cases. please take a look.

zhenpesky avatar Apr 20 '23 20:04 zhenpesky

This is looking good @zhenpesky . I think this is a good candidate to add to the new Patterns section on the website. @andrew-ronaldson @mmenestr please also review and let me know your thoughts.

mcarrano avatar Apr 21 '23 13:04 mcarrano

I agree it's a good start, would just want to see more info on when to use which one of these onboarding methods!

mmenestr avatar Apr 21 '23 17:04 mmenestr

Due to the fact that every product has its own need for the design patterns in terms of onboarding, we agreed on just documenting these patterns into uxd-hub. It doesn't mean to be a recommended pattern for every future products but that's how the pattern is being used in use case of certain products. I have created an entry and documented the patterns for this project in the uxd-hub, please click here to see the details. Let me know what you think.

zhenpesky avatar Jun 15 '23 01:06 zhenpesky

Thanks for adding this @zhenpesky I will close this out and we'll refer to the Design Hub guidance when we start adding Patterns on our site.

andrew-ronaldson avatar Jun 15 '23 14:06 andrew-ronaldson