Thought the Design list might want to look at these mockups.
-------- Original Message -------- Date: Thu, 4 Jul 2013 19:41:38 +0530 From: Pragun Bhutani pragun06@gmail.com To: "Discussion list for the Wikidata project." wikidata-l@lists.wikimedia.org Cc: Jon Robson jrobson@wikimedia.org Subject: [Wikidata-l] Requesting feedback for Wikidata Mobile UI Mockups Message-ID: CAM_49zXQtAjEStw1f2HHCbboVE5jnzrrNjGo1oYV5qoHAtmkYw@mail.gmail.com Content-Type: text/plain; charset="iso-8859-1"
Hello,
I've been working on UI Mockups for Wikidata Mobile as a part of my GSoC Project, Mobilize Wikidata. I have 2 mockups uploaded so far and I would appreciate some feedback!
http://www.mediawiki.org/wiki/User:Pragunbhutani/GSoC_2013_Implementation_Ap...
Cheers,
Just a heads up - the skin for mobile will be slightly changing soon to move the star under the title. This may effect some of your design around the title element.
You can preview it here: https://en.m.wikipedia.org/wiki/San_Francisco?mobileaction=beta
I like the simplicity of the design. For data items which are images e.g. flag image I assume the image would be shown instead of text?
My only concern is the repetition of the edit link. I wonder if in future it would be better/possible to present edit in a different way. e.g. using touch gestures to swipe or simply double tapping on an item or actually making the view mode the same as the edit mode. Something to think about..?
Looking forward to seeing a working version of this!
On Fri, Jul 5, 2013 at 8:54 AM, Sumana Harihareswara sumanah@wikimedia.org wrote:
Thought the Design list might want to look at these mockups.
-------- Original Message -------- Date: Thu, 4 Jul 2013 19:41:38 +0530 From: Pragun Bhutani pragun06@gmail.com To: "Discussion list for the Wikidata project." wikidata-l@lists.wikimedia.org Cc: Jon Robson jrobson@wikimedia.org Subject: [Wikidata-l] Requesting feedback for Wikidata Mobile UI Mockups Message-ID: CAM_49zXQtAjEStw1f2HHCbboVE5jnzrrNjGo1oYV5qoHAtmkYw@mail.gmail.com Content-Type: text/plain; charset="iso-8859-1"
Hello,
I've been working on UI Mockups for Wikidata Mobile as a part of my GSoC Project, Mobilize Wikidata. I have 2 mockups uploaded so far and I would appreciate some feedback!
http://www.mediawiki.org/wiki/User:Pragunbhutani/GSoC_2013_Implementation_Ap...
Cheers,
Pragun Bhutani http://pragunbhutani.in Skype : pragun.bhutani
It's about time. I've been hoping for this change for over a year.
On Jul 5, 2013, at 1:45 PM, Jon Robson jrobson@wikimedia.org wrote:
Just a heads up - the skin for mobile will be slightly changing soon to move the star under the title. This may effect some of your design around the title element.
--- Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
I should clarify something here, since it was pointed out to me that this came across as curt -
Quite the opposite. I'm super-duper happy for this change and glad to see it coming about. I think it looks great and will do exactly what we want.
On Jul 5, 2013, at 1:51 PM, Brandon Harris bharris@wikimedia.org wrote:
It's about time. I've been hoping for this change for over a year.
On Jul 5, 2013, at 1:45 PM, Jon Robson jrobson@wikimedia.org wrote:
Just a heads up - the skin for mobile will be slightly changing soon to move the star under the title. This may effect some of your design around the title element.
Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
--- Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
Hi Pragun,
The mockups look good. I noticed that editing actions are put first in comparison to content. Since Wikidata is already quite dense in terms of data (which is expected), adding actions for each piece of data may crowd the UI too much.
I explored some ideas to reduce the density of actions and content:
- *Display information first and provide editing actions in a separate detail view.* In the current mockup you can edit a statement such as "main type", modify its value and add more sources (all from the top-level view). Alternatively, in a simplified top-level view you can just show the information, and allow edit actions once the user accesses to it. - *Allow for richer content.* The current format is text based. Statements can be represented in a way that allow for images to be used.
I created a couple of mockups to illustrate the ideas:
- Mockup 1http://commons.wikimedia.org/wiki/File:Wikidata-mobile-card-proposal.png - Mockup 2 (with additional actions)http://commons.wikimedia.org/wiki/File:Wikidata-mobile-card-proposal-with-actions.png
Note that:
- The description of the item is grouped together. At a detail view the user can chose which parts to edit. For the case when some part is missing, it may be considered to make the indicator of the lacking information into a call to action for editing such element. - I also used text statements but the layout of the statements also allows to fit an image if it was the case.
I hope this helps.
Pau
On Sat, Jul 6, 2013 at 12:18 AM, Brandon Harris bharris@wikimedia.orgwrote:
I should clarify something here, since it was pointed out to methat this came across as curt -
Quite the opposite. I'm super-duper happy for this change andglad to see it coming about. I think it looks great and will do exactly what we want.
On Jul 5, 2013, at 1:51 PM, Brandon Harris bharris@wikimedia.org wrote:
It's about time. I've been hoping for this change for over a year.On Jul 5, 2013, at 1:45 PM, Jon Robson jrobson@wikimedia.org wrote:
Just a heads up - the skin for mobile will be slightly changing soon to move the star under the title. This may effect some of your design around the title element.
Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
I like the visual treatment of treating data entities as 'cards' and the + icon on Pau's design - although that said since the text is not fixed there would be issues ensuring they all have the same size without resorting to javascript in some way.
I think it would be good if editing the edit switch flipped the cards over (maybe with a css transition) and made them all editable. Could be a really nice javascript based editor...
On Fri, Jul 12, 2013 at 8:24 AM, Pau Giner pginer@wikimedia.org wrote:
Hi Pragun,
The mockups look good. I noticed that editing actions are put first in comparison to content. Since Wikidata is already quite dense in terms of data (which is expected), adding actions for each piece of data may crowd the UI too much.
I explored some ideas to reduce the density of actions and content:
Display information first and provide editing actions in a separate detail view. In the current mockup you can edit a statement such as "main type", modify its value and add more sources (all from the top-level view). Alternatively, in a simplified top-level view you can just show the information, and allow edit actions once the user accesses to it. Allow for richer content. The current format is text based. Statements can be represented in a way that allow for images to be used.
I created a couple of mockups to illustrate the ideas:
Mockup 1 Mockup 2 (with additional actions)
Note that:
The description of the item is grouped together. At a detail view the user can chose which parts to edit. For the case when some part is missing, it may be considered to make the indicator of the lacking information into a call to action for editing such element. I also used text statements but the layout of the statements also allows to fit an image if it was the case.
I hope this helps.
Pau
On Sat, Jul 6, 2013 at 12:18 AM, Brandon Harris bharris@wikimedia.org wrote:
I should clarify something here, since it was pointed out to methat this came across as curt -
Quite the opposite. I'm super-duper happy for this change andglad to see it coming about. I think it looks great and will do exactly what we want.
On Jul 5, 2013, at 1:51 PM, Brandon Harris bharris@wikimedia.org wrote:
It's about time. I've been hoping for this change for over ayear.
On Jul 5, 2013, at 1:45 PM, Jon Robson jrobson@wikimedia.org wrote:
Just a heads up - the skin for mobile will be slightly changing soon to move the star under the title. This may effect some of your design around the title element.
Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
Brandon Harris, Senior Designer, Wikimedia Foundation
Support Free Knowledge: http://wikimediafoundation.org/wiki/Donate
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design
-- Pau Giner Interaction Designer Wikimedia Foundation
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design