Oscar Dashboard V1 (Calendar and Task List)

aaronvux commented 3 years ago

As Oscar, after I complete onboarding or I am signing to the Navigator again, I need to see a Dashboard of items that I can access to successfully manage my business.

Acceptance criteria

If the user is an existing business after completing onboarding, send them to the Oscar Dashboard and populate their profile appropriately with their information.
The Dashboard will have a unique URL from the Roadmap.

Header:

Hello, (Full Name from Navigator Profile)
Content: "Welcome to your personalized guide about running a business in New Jersey."
Edit Profile Link (takes the user to their profile)

Section Title: My Calendar

Display Tax Calendar based on Business Formation Date from Onboarding
Content below calendar: "This calendar does not comprise the entirety of your obligations as a business."

Section Title: Opportunities

Independently scrollable from the left side of the page.
Individual tasks populated based on Onboarding selections -- 10 funding opportunities to all users (tdb on funding opportunities) -- Veteran Owned Certification Task if Veteran is selected from the Demographic question
Add link: View More Full Funding Opportunities at the end of the list. -- Opens new tab to https://business.nj.gov/funding

Opportunties Tiles

Opportunity Type
Title Link -- Clicking the link navigates the user to the associated Task screen in the same window.
Task Description (tbd about the display length)

Task/Opportunity Screen

Only Display Operate Section with Oscar Tasks/Opportunities and the Annual Report in bulleted list. -- Create Oscar Funding Task files. -- Create Oscar Certification Task files.
Green call to action button as applicable.

Funding Airtable Mapping:

Opportunity Type: Funding
Title: Program Name (airtable)
Task Description: Description + Benefits Summary + Eligibility (airtable)
Call to Action Button Copy: "Apply Now"
Call to Action Button URL: Call to Action URL (airtable)

Designs

Desktop: https://www.figma.com/file/408Krq8roicOzFVYrjwIdE/Navigator-Designs?node-id=7350%3A170609

Mobile: https://www.figma.com/file/408Krq8roicOzFVYrjwIdE/Navigator-Designs?node-id=7464%3A172513

Task Screen: https://www.figma.com/file/408Krq8roicOzFVYrjwIdE/Navigator-Designs?node-id=7350%3A170886

Additional Acceptance Criteria:

Follows Design
Works in Mobile
508 Compliance
Feature Flag

Google Analytics

TBD

Notes

[x] UX Review
[x] PO Approval
[x] Content Approval

aaronvux commented 2 years ago

Remember to include adding Number of Employees and Certifications in the mini profile in this story or create a new one.

aaronvux commented 2 years ago

Removing Airtable: https://airtable.com/appMLFtbZCJrJPTf4/tblFkGCCfFEWORzDA/viwlGyyn6eJdsxKEc?blocks=hide

aloverso commented 2 years ago

@aaronvux @Jesslax what are the 10 funding opportunities we'll use for this story? and what is the logic/conditions for when we show them to a user based on their onboarding questions?

Jesslax commented 2 years ago

@aloverso for MVP there are no conditions, we are just showing ~10 programs to all businesses

aloverso commented 2 years ago

@aaronvux also, to clarify, the "Mark as complete" button on the task screen, that's shown in the designs - is that part of this story?

aloverso commented 2 years ago

@carye3 @fiorella-io What should the header say in the event that the user hasn't provided a name?

fiorella-io commented 2 years ago

@aloverso We haven't explored the "guest checkout" for oscar, but I'm thinking something like, "Welcome to Navigator" if we don't ask for the name during onboarding. We still need to test the 2 different flows and then decide whether we want to have dynamic headers or a generic header. This might need to be handled in another story.

carye3 commented 2 years ago

@aloverso the task screen for annual report should remain the same. Figma designs have been updated

aloverso commented 2 years ago

@fiorella-io It's not just for guest checkout, but due to the way we iterated to the current signup experience, there are some active users right now for whom we don't have a name. It's uncommon but it's possible. So even if it's just static text, we do need to handle it for this story.

aloverso commented 2 years ago

@aaronvux just want to clarify in the acceptance criteria - it says "Veteran Owned Certification Task if Veteran is selected from the Demographic question" but @Jesslax commented that for MVP there is no logic, we just show all the opportunities? should that AC be removed?

aaronvux commented 2 years ago

@aloverso I believe this is only for the funding opportunities and not the Veteran Owned Certification task. @Jesslax can you confirm please?

fiorella-io commented 2 years ago

@aloverso In that case we can't really use what we have now (Roadmap for [business name]) since it's not a roadmap anymore for oscar. I say we use "Welcome to Navigator". @Jesslax what do you think?

aloverso commented 2 years ago

@fiorella-io Are the colors for the Certification and Funding tags final? I worry they're too similar such that the distinction won't be accessible for colorblindness and similar

(@namanaman says he is colorblind and could not tell they were different colors)

carye3 commented 2 years ago

@fiorella-io the colors are based on the existing tag colors for NJ WDS... i think the color-blind fix is including text in the tag (taxes, filings, etc). But that works for the tiles, and some text for type of task should also be included in the calendar

aloverso commented 2 years ago

@carye3 @fiorella-io oh I didn't realize those purple colors were in NJWDS? Can you send me where in the design system you found them - I couldn't find those colors in NJWDS when implementing it, so it'd help me make the code cleaner if I knew where in the system it existed.

aloverso commented 2 years ago

@carye3 @fiorella-io Implementing this story made me notice the inconsistent link styling, both on this page and across the site on the roadmap/task pages. What is the design intention for the difference? When do we make a link green (which is used here on the "Edit Profile" link and in the content of the task pages) and when do we make a link black (like on the opportunity cards here, and also how the Edit Profile link and the Task Page links look on the roadmap page)

aloverso commented 2 years ago

@aaronvux what is the desired url for the "task pages" here? We already have the Annual Report screen, for example, in the operate section that lives at /filings/annual-report

Since the designs look like we want to combine "filings" and "opportunities" to all be in the same section, what do we want the prefix to be for all of them? Keep /filings? Change to /opportunities? something else

aaronvux commented 2 years ago

@aloverso Let's talk about it quickly in grooming, but I would suspect opportunities.

kmelefsky commented 2 years ago

next steps - independently scrollable feature is last item to work on

aloverso commented 2 years ago

@aaronvux ready for review

aaronvux commented 2 years ago

@carye3 @CeciliaRam Please review. We are still waiting on the business formation date work, so you won't see a date yet in the calendar, but everything else looks good to me from the AC.

CeciliaRam commented 2 years ago

@aaronvux reviewed content with Jess, we had one change (One sentence at the bottom of the page after the calendar: "this is not a complete list of your obligations as a business"). The change was made both in the Figma file and GitHub file.

carye3 commented 2 years ago

Lgtm

newjersey / navigator.business.nj.gov