<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Generator" content="Microsoft Word 15 (filtered medium)">
<style><!--
/* Font Definitions */
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
{font-family:Verdana;
panose-1:2 11 6 4 3 5 4 4 2 4;}
@font-face
{font-family:"Lucida Sans Unicode";
panose-1:2 11 6 2 3 5 4 2 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:purple;
text-decoration:underline;}
p.MsoListParagraph, li.MsoListParagraph, div.MsoListParagraph
{mso-style-priority:34;
margin-top:0in;
margin-right:0in;
margin-bottom:0in;
margin-left:.5in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
p.msonormal0, li.msonormal0, div.msonormal0
{mso-style-name:msonormal;
mso-margin-top-alt:auto;
margin-right:0in;
mso-margin-bottom-alt:auto;
margin-left:0in;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
span.EmailStyle18
{mso-style-type:personal-reply;
font-family:"Calibri",sans-serif;
color:windowtext;}
.MsoChpDefault
{mso-style-type:export-only;
font-family:"Calibri",sans-serif;}
@page WordSection1
{size:8.5in 11.0in;
margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
{page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang="EN-US" link="blue" vlink="purple">
<div class="WordSection1">
<div>
<div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>> In terms of a design library that matches the style of the web UI we’ve been working on, Bootstrap would be a great choice:
<a href="https://bootstrap-vue.js.org">https://bootstrap-vue.js.org</a> <o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">> We agree to use Bootstrap-Vue for the Vue framework rewrite. Bootstrap-Vue does not have an icon library and refers to third-party sources. Since we are already
using the Carbon Design System icons, can we agree to continue to use them?<o:p></o:p></span></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Yes, I’m ok continuing to use the Carbon Design System icons. I agree, also, that if an icon does not exist in the library, we can use the library’s icons to make new icons that match that style. <o:p></o:p></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Verdana",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>> However, I wonder if we could find a happy medium between the two styles? I’ve been looking for websites that have elements of both style preferences -- that
include the more modern look (larger elements, rounded corners, light colors), with the more stable look (dark colors, square elements) – and found these great examples:<br>
>><br>
>>- Invision App’s website <a href="https://www.invisionapp.com/">https://www.invisionapp.com/</a><br>
>>- Visual Studio Code website <a href="https://code.visualstudio.com/">https://code.visualstudio.com/</a><br>
>>- GitHub website <a href="https://github.com/">https://github.com/</a> <o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><br>
>Thank you for sending the site examples. They are great examples of well-designed user interfaces. Although the proposed Intel UI updates provide some pattern improvements, the overall layout and design changes don't feel as polished as the examples you shared.
We believe more collaboration is needed to improve the design and implementation of the proposed changes to meet both Intel's and IBM's needs.<o:p></o:p></span></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Yes, agreed that with additional collaboration we can continue to polish the design – in all cases, both the existing UI and my proposed designs can continue to look cleaner with more time and collaboration. As I’ve gone through each page
downstream, I’ve done a basic update focusing on style & UX, making incremental improvements with the goal of moving things to an even more polished state with additional investment of time and resources. I wanted to share our work once we’d gotten initial
working designs, and did not feel it was important to invest further time in them before beginning the stylistic conversation we’ve been having, since as we collaborate, it’s efficient to address details in the process and after some of the bigger issues are
agreed upon. <o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">I believe the process that Jandra and I have begun, reviewing the design proposals page-by-page, is a great example of how we can continue to collaborate and work towards the best result and get a polished look with some agreed upon elements
representing both a stable and modern style. <o:p></o:p></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>A little over a year ago, we developed an OpenBMC style guide to make it easier for designers and developers to contribute to the project. We built a living style
guide prototype, but Ed's concern about who would develop and maintain the guide kept it from moving forward. The inconsistency and lack of code reuse throughout the application is the result of not having this documentation.<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>OpenBMC Style Guide: <br>
<a href="https://ibm.invisionapp.com/share/EBNYECMH3Y2#/318986393_Grid">https://ibm.invisionapp.com/share/EBNYECMH3Y2#/318986393_Grid <br>
</a><br>
>OpenBMC Style Guide Prototype: <br>
<a href="https://derick-montague.github.io/openbmc-styleguide-proposal/">https://derick-montague.github.io/openbmc-styleguide-proposal/</a> <o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>As we rewrite the application in Vue, we have an opportunity to create this documentation and assure that the OpenBMC UI is clean, maintainable, and adheres to
an agreed-upon set of values. Since joining the project, you have been working alone on both design and development. We hope that we can work as a team to collaborate and lean on each other's strengths. <o:p></o:p></span></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Indeed – I agree that all of the design work we do can be better through this collaboration.<o:p></o:p></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>I feel the next step is to schedule a meeting to review the existing style guide. We can then determine what needs to be updated to meet both Intel's and IBM's
needs. We can use the updated style guide to create the theme changes required for the Bootstrap-Vue out of box experience to adhere to the updated style guide.<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>This effort will require a stronger focus on the framework update and style guide development. When we start working on the framework update, the only updates
to the AngularJS UI will be critical bug fixes. Our goal is to have the framework update complete no later than the end of Q2 2020.<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">>What are your thoughts on this plan?<o:p></o:p></span></p>
</div>
<div>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif">I do have concerns about the dynamic nature of the site’s development and the potential static nature of a design guide. I wonder if it might be best to continue
working towards consensus with our concept process, and then revisit the style guide once we get a little further towards that consensus. It might require us all to revisit how we can find a stylistic compromise, and perhaps we look to those sites I shared,
or others as well, as possible stylistic directions that would work. I also believe that with some CSS consolidation – which is something I’ve been working on downstream - many elements would be easily standardized and consistent. We could revisit the design
library, which I do think is a good potential option if we can agree on one, or we could make a concerted effort to clean up CSS, to make it more of a sitewide style guideline in and of itself, during this collaboration as well.<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:10.0pt;font-family:"Lucida Sans Unicode",sans-serif"><br>
<o:p></o:p></span></p>
</div>
</div>
</div>
<p class="MsoNormal"><o:p> </o:p></p>
</div>
</body>
</html>