google / ioweb2016

I/O web app 2016
https://events.google.com/io2016
Apache License 2.0
518 stars 87 forks source link

Schedule: update survey/session rating #431

Closed ebidel closed 8 years ago

ebidel commented 8 years ago

It's a dialog on io-schedule-page.html

@jcreech83 can you get us a sketch file?

jcreech83 commented 8 years ago

Will have tomorrow. This should start Phase 4 though, as you don't rate the session until you've been to it.

pengying commented 8 years ago

Is the sketch ready to share?

jcreech83 commented 8 years ago

Here you go: https://drive.google.com/a/instrument.com/file/d/0B8qDVZUr5SzsaGVXOWI0ZEdPRFU/view?usp=sharing

Also included confirmation for session detail when rating is submitted.

Let me know if you have any questions.

pengying commented 8 years ago

Are we doing a double dialog? One dialog for the session details, a second one for the rate this session?

jcreech83 commented 8 years ago

Session detail should be an individual page. Rate session is a dialog/modal over the detail page.

@ebidel can you confirm?

ebidel commented 8 years ago

Last year was dialog for details and an addition dialog for ratings. master has an experiment for a separate panel for session details, but UX-wise, it complicates things quite a bit with the double nav scrolling behaviors we have, scroll positioning/restore between days, scroll locking the page, and a11y stuff. I think we'll need to stick with overlay dialogs for both the session details and the ratings panel.

jcreech83 commented 8 years ago

There was a request to change numbers to stars. Here's updated design: https://drive.google.com/file/d/0B8qDVZUr5SzsZnhPdDB4OG5FMVk/view?usp=sharing

pengying commented 8 years ago

Is this how we want it to look with the double modal dialog?

screen shot 2016-04-08 at 3 33 09 pm
jcreech83 commented 8 years ago

Could we have the content in the session model to change to the rating? So you still see "<-- Full Schedule" with rating content below. We could then add a close X on the top right of the blue header to close the rating to get back to just the session detail.

Thoughts?

pengying commented 8 years ago

So like this? What's the animation for displaying the rate the session? Animate from bottom? mock

jcreech83 commented 8 years ago

That looks good, thanks.

Can you also add a close to the top right in the blue, which will close the rating and go back to session detail?

pengying commented 8 years ago

So I'm stuck in terms of UI. I'm not quite sure what to do in terms of fitting the survey to the details page when the sizes don't match. Also I don't want to layer in a double scroll area. Any ideas?

https://drive.google.com/file/d/0B4ckTgWcMsYxVlpUS1RidTViTU0/view?usp=sharing

jcreech83 commented 8 years ago

Can you hide the session details once the rating comes up? If easier, can remove the full schedule back button and just have the rating info. Should include close X on rating, which would take uses back to session details if clicked.

ebidel commented 8 years ago

Peng does setting height: 100% work on the ratings? or using the fit attribute on it?