882135 - Events page design QA

Status: RESOLVED FIXED

(Webmaker Graveyard :: Events, defect)

Description

[Cassie McDaniel [:cassiemc]]

Here's the start of a design QA list:

* scrolling on the mouse should not zoom the map. It's an unexpected UX and users will probably not get down to the bottom of the page to see the CTAs.
* replace background red colours in buttons with the blue: #27aae1 – we're no longer using red as an "active" button colour.
* Where and When fields are missing the calendar and point icons. The PSDs are here:
https://docs.google.com/file/d/0BzfN9sXlOXt1aDBIUEk2OWFzSW8/edit?usp=sharing

Are there any sample events detail pages so I can do QA on that page as well?

Comment 1

[Cassie McDaniel [:cassiemc]]

This is a rather big thing that is missing: Where is the area for the feature banner that will hold the summer Maker Party image and some intro text? 

I imagine a quick solution is that Dale (or someone) needs to copy over the  header/feature image area from existing standard templates into this section as well above the map, so that we have somewhere to put in the descriptive header copy listed here:  https://etherpad.mozilla.org/v2-copy-events

Marking this bug as a blocker, as it appears to be missing key requirements.

Comment 2

[Cassie McDaniel [:cassiemc]]

More QA (now that I've zoomed all the way out, have a bit more to add):

Overall:
* default view should be of the world, not SFO
* can we see examples of clustering? Want to see how multiple pins look close together.
* are makes associated with events currently being surface on the map? Don't see any circle pins.

Event preview popup:
* remove the orange colour bar on the bottom of the box. We've scrapped this style.
* profile image can be smaller. 35x35 <--- does this functionality work yet?
* remove rounded corners from the > button
* the > button should be 10 px from the right and bottom hand sides of the box, so equal margins.
* hover state for > btn should be blue, not red.
* the box itself should have a dropshadow (not outline)

Events Detail page (am assuming this is not finished)
* correct icons for the pin and calendar can be found here: https://docs.google.com/file/d/0BzfN9sXlOXt1MjZsZGE0TVM5VjA/edit?usp=sharing
* missing photo area.
* need to see description.
* remove orange border at the bottom.
* "organized by" should be centred vertically with the profile image
* event info text should be #787878
* missing footer elements (related events, explore things ppl have made, etc.)

Comment 3

[Mike Beltzner [:beltzner, not reading bugmail]]

Meta bugs (ie: bugs that are lists of issues) can never block; only single issues can block, sadly.

Comment 4

[Mike Beltzner [:beltzner, not reading bugmail]]

(In reply to Cassie McDaniel [:cassiemc] from comment #0)
> * scrolling on the mouse should not zoom the map. It's an unexpected UX and
> users will probably not get down to the bottom of the page to see the CTAs.

I have a pretty fundamental disagreement with both the assertion that it's not expected UX (if the user's don't know there are CTAs at the bottom of the page, why would they expect the page to scroll instead of zoom like every other online map interface?) as well as the requirement as stated. We had a big discussion about this in IRC, and no firm conclusion was reached. I'd like to see if we can get away with keeping scroll-to-zoom while also exposing the required content from the CTAs

> * replace background red colours in buttons with the blue: #27aae1 – we're
> no longer using red as an "active" button colour.

Filed as bug 882336

> * Where and When fields are missing the calendar and point icons. The PSDs
> are here: https://docs.google.com/file/d/0BzfN9sXlOXt1aDBIUEk2OWFzSW8/edit?usp=sharing

Filed as bug 882338

> This is a rather big thing that is missing: Where is the area for the
> feature banner that will hold the summer Maker Party image and some intro
> text? 

Filed as bug 882340

> * default view should be of the world, not SFO

While we should continue to use geolocation to try and center the map on or around the user's location, I agree that we could have a different default zoom location of "the whole wide world" in cases where we don't get a geolocation signal, as opposed to SFO.

Filed as bug 882347

> * can we see examples of clustering? Want to see how multiple pins look
> close together.

That's already visible if you look around downtown Toronto; try it out. First click zooms in so you can see where the individual pins actually lie. If there are multiple pins in the same location, a second click has them "pop" out to show each pin individually.

> * are makes associated with events currently being surface on the map? Don't
> see any circle pins.

Not yet, and not in scope at this time, sadly.

> Event preview popup:
> * remove the orange colour bar on the bottom of the box. We've scrapped this
> style.

Filed as bug 882351

> * profile image can be smaller. 35x35 <--- does this functionality work yet?

Filed as bug 882355

> * remove rounded corners from the > button
> * the > button should be 10 px from the right and bottom hand sides of the
> box, so equal margins.
> * hover state for > btn should be blue, not red.

All filed as bug 882360

> * the box itself should have a dropshadow (not outline)

Filed as bug 882362

> Events Detail page (am assuming this is not finished)
> * correct icons for the pin and calendar can be found here:
> https://docs.google.com/file/d/0BzfN9sXlOXt1MjZsZGE0TVM5VjA/edit?usp=sharing

Filed as bug 882366

> * missing photo area.

If you mean "photos from the event" we've left this out intentionally for now. We may add it in again soon, but for now, I'll leave it as a feature bug to file.

> * remove orange border at the bottom.

Filed bug 882370

> * "organized by" should be centred vertically with the profile image

Filed bug 882373

> * event info text should be #787878

Filed bug 882374

> * missing footer elements (related events, explore things ppl have made,
> etc.)

Those feel like feature additions at this point, so I'll leave them to be filed later or by someone else, but don't think they should be set to block this bug. Don't want to scope creep things up if we don't have to, though I agree that they'd be nice to add soon / later!

We also talked in IRC about bug 882367 (change page background colour to e7edf0)

Comment 5

[Cassie McDaniel [:cassiemc]]

(In reply to Mike Beltzner [:beltzner] from comment #4)
> (In reply to Cassie McDaniel [:cassiemc] from comment #0)
> > * scrolling on the mouse should not zoom the map. It's an unexpected UX and
> > users will probably not get down to the bottom of the page to see the CTAs.
> 
> I have a pretty fundamental disagreement with both the assertion that it's
> not expected UX (if the user's don't know there are CTAs at the bottom of
> the page, why would they expect the page to scroll instead of zoom like
> every other online map interface?) as well as the requirement as stated. We
> had a big discussion about this in IRC, and no firm conclusion was reached.
> I'd like to see if we can get away with keeping scroll-to-zoom while also
> exposing the required content from the CTAs

I believe the proposed solution for now was to shorten the height of the map area.

> 
> > * replace background red colours in buttons with the blue: #27aae1 – we're
> > no longer using red as an "active" button colour.
> 
> Filed as bug 882336
> 
> > * Where and When fields are missing the calendar and point icons. The PSDs
> > are here: https://docs.google.com/file/d/0BzfN9sXlOXt1aDBIUEk2OWFzSW8/edit?usp=sharing
> 
> Filed as bug 882338
> 
> > This is a rather big thing that is missing: Where is the area for the
> > feature banner that will hold the summer Maker Party image and some intro
> > text? 
> 
> Filed as bug 882340
> 
> > * default view should be of the world, not SFO
> 
> While we should continue to use geolocation to try and center the map on or
> around the user's location, I agree that we could have a different default
> zoom location of "the whole wide world" in cases where we don't get a
> geolocation signal, as opposed to SFO.
> 
> Filed as bug 882347
> 
> > * can we see examples of clustering? Want to see how multiple pins look
> > close together.
> 
> That's already visible if you look around downtown Toronto; try it out.
> First click zooms in so you can see where the individual pins actually lie.
> If there are multiple pins in the same location, a second click has them
> "pop" out to show each pin individually.

I don't see any pins in Toronto. I did see the clustering elsewhere though. The number needs to be 2pt sizes smaller.

> 
> > * are makes associated with events currently being surface on the map? Don't
> > see any circle pins.
> 
> Not yet, and not in scope at this time, sadly.
> 
> > Event preview popup:
> > * remove the orange colour bar on the bottom of the box. We've scrapped this
> > style.
> 
> Filed as bug 882351
> 
> > * profile image can be smaller. 35x35 <--- does this functionality work yet?
> 
> Filed as bug 882355
> 
> > * remove rounded corners from the > button
> > * the > button should be 10 px from the right and bottom hand sides of the
> > box, so equal margins.
> > * hover state for > btn should be blue, not red.
> 
> All filed as bug 882360
> 
> > * the box itself should have a dropshadow (not outline)
> 
> Filed as bug 882362
> 
> > Events Detail page (am assuming this is not finished)
> > * correct icons for the pin and calendar can be found here:
> > https://docs.google.com/file/d/0BzfN9sXlOXt1MjZsZGE0TVM5VjA/edit?usp=sharing
> 
> Filed as bug 882366
> 
> > * missing photo area.
> 
> If you mean "photos from the event" we've left this out intentionally for
> now. We may add it in again soon, but for now, I'll leave it as a feature
> bug to file.

Ok.
> 
> > * remove orange border at the bottom.
> 
> Filed bug 882370
> 
> > * "organized by" should be centred vertically with the profile image
> 
> Filed bug 882373
> 
> > * event info text should be #787878
> 
> Filed bug 882374
> 
> > * missing footer elements (related events, explore things ppl have made,
> > etc.)
> 
> Those feel like feature additions at this point, so I'll leave them to be
> filed later or by someone else, but don't think they should be set to block
> this bug. Don't want to scope creep things up if we don't have to, though I
> agree that they'd be nice to add soon / later!

When Brett and I spoke with Amoeba we did come up with an MVP solution for this. Not sure if that decision has changed, since.

> 
> We also talked in IRC about bug 882367 (change page background colour to
> e7edf0)

Comment 6

[hike]

cassiemc: There is no separate edit-page, but instead an "edit-mode" in the details page. To reach it:
  * Create an event
  * You'll see an "Edit" button under "Organized by", click it

-- Hike Danakian

Comment 7

[hike]

Regarding event photos, you can add up to a single photo when you create the event, then you can change the photo in the event-details page in edit-mode.

Comment 8

[Matthew Schranz [:mjschranz]]

Couple things I want to put in here that are problems I've seen for a bit and want to make sure they don't fall by the way side.

1. This is what the button looks like now in the little popup selecting an existing event https://dl-web.dropbox.com/spa/qxpeeqhhsjhcqcf/fhxkwjgs.png

2. I can enter new events that are in the past. Related, events that have occurred should not appear on the map.

3. There still is this focus issue with the add event fields. If I start typing a location for example, use the arrow keys on my laptop to select the auto generated location and hit enter, I get text populated in the description. See https://dl-web.dropbox.com/spa/qxpeeqhhsjhcqcf/aetx-v5c.png

Comment 9

[Brett Gaylor [:brett]]

> 2. I can enter new events that are in the past. Related, events that have
> occurred should not appear on the map.

Cassie, could you actually weigh in on that?  We had a bunch of discussion about this when we were speccing this out, mentor team had expressed that past events might be useful for community building.  where did we land?

Comment 10

[Cassie McDaniel [:cassiemc]]

(In reply to Brett Gaylor [:brett] from comment #9)
> > 2. I can enter new events that are in the past. Related, events that have
> > occurred should not appear on the map.
> 
> Cassie, could you actually weigh in on that?  We had a bunch of discussion
> about this when we were speccing this out, mentor team had expressed that
> past events might be useful for community building.  where did we land?

I agree with Matt. At this point it doesn't make sense to be able to add past events, because there's no good way to visualize that and differentiate it from current events. Could be v. frustrating for a user to click on a pin after pin that are all past events.

In the future, we should hopefully be able to use an alternate pin or different visualization to reveal the "network" of events and organizers that have already been active.

Comment 11

[Matthew Schranz [:mjschranz]]

(In reply to Brett Gaylor [:brett] from comment #9)
> Cassie, could you actually weigh in on that?  We had a bunch of discussion
> about this when we were speccing this out, mentor team had expressed that
> past events might be useful for community building.  where did we land?

I didn't know about this, so I can see why keeping previous events makes sense. There definitely should be some UI indicating them as such.

Comment 12

[Cassie McDaniel [:cassiemc]]

> I didn't know about this, so I can see why keeping previous events makes
> sense. There definitely should be some UI indicating them as such.

If we want a diff. pin for past events I can mock a quick and dirty solution (probably just a faded, black and white pin), not sure if this is technically tricky at this point?

Comment 13

[Pomax]

can we resolve this ticket in part or in whole with follow-ups?

Comment 14

[Cassie McDaniel [:cassiemc]]

We can resolve this. Will add the "past events" functionality to our list of future ideas.