Looks great 😍
|current (53px)||proposed (48px)|
@Esanders thanks for pointing this out. I see visual feedback when I tap on the menu icons (on iOS and Android):
|upon tapping||menu open|
Looking at this more closely, a 48px header looks small and therefore imbalanced to me.
Tue, Jul 16
@Jdlrobson for clarification: the svg we're using in AMC came from OOUI. Though I'm not sure if that means an update is needed or not.
Thu, Jul 11
@Jdlrobson as discussed in Slack we will actually be updating both the search and the bell icons as part of this task. I will update the task description and title accordingly.
@Niedzielski as discussed in Slack, here is the updated icon:
looks good to me
Wed, Jul 10
Interactive read/unread dot
I agree that this isn't super clear. On desktop at least it has a hover state, but on mobile it's not discoverable at all. This is a small fix for starters, just so it stands out more: T227624. Aside from adding a "mark as unread" button I don't have any other small ideas yet. We could look at some other mobile notification systems.
Tue, Jul 9
Mon, Jul 8
Thu, Jul 4
Wed, Jul 3
@Niedzielski met to discuss the points above. Adding notes here for clarity:
Tue, Jul 2
- when I navigate to my sandbox I land on my sandbox and then the editor opens up (this also happens if I navigate to Talk, then using the tabs tap on User page - I only mention this in case it helps your investigation)
- when I navigate to Talk it takes me to the wikipage version instead of the modal version
- (Android only) the tap highlight on the menu items lingers for a moment after the menu closes. This is also the case with the overflow menu. Not sure it's worth looking into but wanted to point it out in case it's something obvious.
Mon, Jul 1
@scervantes looks great
Thu, Jun 27
Wed, Jun 26
Tue, Jun 25
Mon, Jun 24
- I like the update for the close button.
- Regarding the primary button — I like the way it currently is on desktop. The full-height button feels more like a mobile pattern to me, though I don't have a specific rationale in mind.
- Regarding the modal title — perhaps on mobile we could left-align the modal title, since there is less space and it can often look awkward to have a centered title, particularly if the text of the primary button is longer. But leave it centered on desktop?
Jun 21 2019
@Isaac the open-text field generally looks fine to me. Are there specific questions/concerns you had? A few other small things I noticed:
@geraki thanks, I think I understand, and I agree with you. If you watch a topic, within a talk page, the updates to that topic do not appear on your watchlist (but they should).
@nray I think either way (OOUI or native) is fine. Whatever is easier.
Jun 20 2019
that sounds right to me. When the overflow menu is enabled we should always make this "icon shuffle" (as you called it).
(a comment I meant to submit on June 12th — submitting here for the record) After speaking further with the team and Nirzar I've resolved to stick with the original design, wherein we move the Language action to the overflow menu in order to make space for Contributions. The task description is up to date.
I think with some minimal fixes we might be alright here:
@Jdrewniak wow, looking awesome. I thought of how we might simplify it further, though unless it'd be relatively easy to do I don't know that it's worth investing more time here since it's working fine already.
Jun 19 2019
@Esanders I agree that it would be good to unify these. In practice there are two issues with the OOUI tab system, given this example:
@Niedzielski thanks for making the updates and the new task
@Niedzielski questioning whether or not this drawer pattern is appropriate for Notifications. We don't have this well defined but here is an attempt at articulating the differences between drawers and modals/overlays.
noting the related task here T225260
@ovasileva agreed. The default message when you change a setting seems to be "Settings were saved." If we could have a custom message in this case that'd be great. I've added mocks of the flow to the description.
Jun 18 2019
@Jdlrobson is this task still relevant? If so, I'm wondering if it's a design task or more of an engineering task with potential design input?
@Volker_E could you clarify the intention here? When I click on a link to a section within the article I land on the page scrolled to the open section, e.g.
it seems that wrapping the table in a div like so <div style="overflow-x:auto">...</div> is one way to prevent this issue for Vector, Minerva, and MF. You can see this on the table in the Web technology support section and in the Image format support section. @Jdlrobson curious what kind of approach you think might be appropriate here? Is there a way to bake that kind of styling into all tables?
@nray just noticed that the wikidata icon is black instead of #54595d.
Jun 17 2019
@Jdrewniak awesome progress. Just checked this out on iOS and Android. The two main things that seem worth improving:
Jun 13 2019
@nray I didn't realize that wikidata items could show up on user pages. I'd say the priority here is main namespace pages, though the ultimate goal would be parity with desktop. Not sure how much scope that would add.
Jun 12 2019
Jun 11 2019
@ovasileva I was thinking in the case that we find some extreme results (e.g. one or two of the items are used way more frequently than the others) we could make an update before pushing AMC out more broadly. I checked with @pmiazga and the menu items are easy to re-order. Though I'm also fine with that being out of scope for AMC.
@Cntlsn I wonder if a shorter message would work?
@Jdrewniak cool, sounds like that might be the best direction. We don't need to support highlighting btw. By removing that button on each row there is more horizontal space for the description.
Jun 10 2019
@Cntlsn my apologies for the late feedback here. Nirzar pointed out to me that we generally use toast messages instead of dialogs on mobile, e.g.
@pmiazga good catch. This is an issue on mobile and desktop. Also, if you expand the filter, add some criteria, then click "Show results" the filter closes when the results are shown. Ideally the filter would remain expanded in that case.
Also to note: we're not building that functionality for AMC. It was a sketch to help us explore ideas around promoting the feature.
@Cntlsn I wonder if notifications would be a more appropriate mechanism for this?
- The dot on the hamburger menu seems more like a mechanism to lead users to a new, generic feature that has appeared (unrelated to a specific action the user has taken) - e.g. "new feature available in settings". In this case the interface has changed because of an action the user took (creating an account). It is more personal than generic.
- I think if using the dot we also need to leave the user with a clear understanding of how it functions. The homepage is place the user will visit multiple times, so the dot might be misunderstood as a notification mechanism for contents on that page. In other words, is it announcing that the page exists, or announcing that there are updates/actions on the page to respond to? Should you expect a dot if you get a message from your mentor, or once your email has been verified, etc.? In the case of the settings page I tried to have a message at the end of the trail about "new setting" so it was clear what that dot was communicating.
It seems like all three filters (basic, namespace, and tags) use the same dropdown panel thing and are equally broken?
Thinking about this some more:
I am not familiar with this part of the UI or categories more generally. My thoughts:
Jun 7 2019
@MMiller_WMF no conflict with AMC unless you'd also want to add something to the non-empty state of User contributions
Jun 6 2019
bumping the priority on this, I think it's a useful feature especially as a newcomer.
@MMiller_WMF perhaps this is something that would be interesting to y'all. It should help newcomers better understand what their watchlist is and how to use it.
@Edtadros it seems that the QA steps are out of sync with the Acceptance criteria, from the description:
(#2) If a user page exists (e.g. https://en.m.wikipedia.org/wiki/User:127.0.0.1) then the talk/contributions/upload bar and page actions bar shows (AMC & non-AMC)