clearbold / artx

1 stars 0 forks source link

Onboarding & signup screen #14

Closed heymarkreeves closed 10 years ago

heymarkreeves commented 10 years ago

Hi, Sherri!

This is breaking the rules of an assigned issue, but I figured this would be a good place to capture discussion on the signup & onboarding process that we could share with the team.

In terms of presenting the sign-up/onboarding option in our template list, I'd like to present a distinct version of the home screen that has the overlay enabled. This can either be a complete copy of the home screen (maybe using Jekyll includes to avoid duplication of code), or it can be something like home.html?signup=yes and you can parse that in JavaScript.

In the real app, this will be handled by a cookie and application logic.

I like their idea of the modal interstitial for signup. It should include:

  1. Some brief copy
  2. An email field
  3. A password field
  4. A confirm password field
  5. A submit button
  6. An "Already have an account? Sign in" link

I think the sign in link should leave the modal and go to a full page with sign-in fields. That page should also be linked to in the nav. If the user is logged in, that link should become a log out link.

The sign in screen should have a link to trigger the sign up modal as well, if you navigated there and found you didn't have an account.

There should be a X at the top right of the modal. If I choose to not sign up or sign in, and close it, I should see the home screen, with top events. "My favorites" should be empty of thumbnails and there should be text there about how you can add your favorites. There should be sign up or sign in text there with links.

If you submit the sign up process from the modal, I think it should fully navigate in the parent window to the form processing page (app logic) and that should redirect back to the home screen with the cookie set that says you're logged in.

In that state, "My favorites" would still be empty, but the content would change. It would (briefly) explain how you benefit from adding things to your favorites.

In-between submission of the form and redirection to the home screen is where we're supposed to intercept the user and encourage them to add tags. I think we should hold that for a conversation. I think that could just be a full screen with some copy at the top and a "Continue to my home screen link," but let's get some more pieces in place before we tackle that flow.

So, for a start, we'll need:

  1. The homepage with the modal triggered
  2. 2 different states of "My favorites" copy
  3. A sign-in screen in the app screens
  4. Sign in / Log out in the nav
  5. Examples of inline error handling in the modal, assuming that there will be JS/AJAX logic to validate password requirements and check if an email address is already in the database

Let me know what you think--We can discuss in comments here or in Slack.

Thanks!

Mark

heymarkreeves commented 10 years ago

Will move these into individual issues.