NEW GUI Design work group starts Wed, Oct 17

[Joseph Reynolds]

> Message: 1
> Date: Wed, 3 Oct 2018 13:01:52 -0500
> From: susan jasinski <susantjasinski at gmail.com>
> To: openbmc at lists.ozlabs.org
> Subject: NEW GUI Design work group starts Wed, Oct 17
> Message-ID:
> 	<CANT4Nr+UGpw7j7BpBOmxLxMzgW10Uk=1t6sg1frnwuS2Kq9j2A at mail.gmail.com>
> Content-Type: text/plain; charset="utf-8"
>
> Hello everyone.
>
> My name is Susan Jasinski, and I am the UX Design Lead for the IBM OpenBMC
> GUI. Alissa Lee and I will be hosting a new bi-monthly OpenBMC work group
> for reviewing new GUI designs. It will be held on the first and third
> Wednesdays of the month.

Welcome!  And thank you for taking on this work.

> Generally, my team will request feedback on GUI designs BEFORE they are
> coded. This could include wireframes, high-fidelity mockups, interactive
> prototypes, and panel flows. If others have pre-code designs they would
> like to share with the community, feel free to add yourself to the agenda.
>
> However, during this first meeting I'd like to discuss how to openly and
> consistently share mockups, provide feedback and track revisions.
>
> Access to the web conference link and the agenda can be found in the
> openbmc-openbmc wiki (just above the Weekly Community Telecon wiki link) .
> https://github.com/openbmc/openbmc/wiki/GUI-Design-work-group
>
> Links to mockups will be sent via email and IRC prior to the meeting.
> Please join the conversation even if you did not have time to review
> designs before-hand.

I followed the wiki to the invisionapp site, and found a sequence of 
images which show firmware update, login, etc.  Creating a free acount 
so could add comments was quick and painless.  I can see this working as 
a way to communicate complex visual design.

However, I'm confused about your intention for this batch of images.  Is 
this intended as a sample of the invisionapp review process?  If so, I 
left a comment on page 1 of 66.  Or do these images represent your first 
designs?  If so, it would help me if you give the purpose for the design 
and then walk through some scenarios.

Example purpose: The "webui/firmware update" (images 1-19) is for system 
administrators who have a firmware image either {on their workstation, 
reachable from the BMC's TFTP server, or already on the BMC} and need a 
GUI to upload and re-configure their server's installed firmware (as in 
https://en.wikipedia.org/wiki/Software_configuration_management from the 
system administrators point of view).

Example scenario "webui/firmware update/error uploading image":
  * Link to starting image: 
https://ibm.invisionapp.com/share/YSNTBXAJGUC#/screens/318858591
  * Covers images 1-4
  - When signed into the webui at the "firmware" tab,
  - with the "Upload image file from workstation" button selected,
  - enter "file.png" in the "Choose file" text entry field (where the 
file exists and is not a valid firmware image)
  - and click the "Upload firmware" button.
  - The "Upload in progress" bar will appear while the file is being 
uploaded, then disappears and
  - the "Error uploading image" dialog box appears.
  - Clicking its "Close" button makes the box go away and does not 
change the "Choose file" field.

Please note that my example scenario makes a number of assumptions which 
should be explicit in the design.  Examples: Does the "Choose file" 
button bring up a file selector box?  Is the filename next to it 
editable?  On image 4, does the filename really change to "image_file.png"?
(Also, I don't know if the link to will work for everyone.)  :-)

I hope you understand that I am not trying to pick on you, but to 
elevate the level of documentation for the overall OpenBMC project. I 
believe writing scenarios like this will help draw more participation to 
your review which will foster better shared understanding and create 
better results.  Not just for webui, but for all of OpenBMC's functional 
areas. </soapbox>

> I am looking forward to seeing you all next week.
>
> -- Susan Jasinski (IBM Lead Designer and User Experience designer)