[Patternfly] FYI - Latest API Management UI

Liz Clayton lclayton at redhat.com
Tue Mar 25 19:28:19 UTC 2014


Hi,

----- Original Message -----
> From: "Emily Dirsh" <edirsh at redhat.com>
> To: patternfly at redhat.com
> Sent: Tuesday, March 25, 2014 2:36:03 PM
> Subject: Re: [Patternfly] FYI - Latest API Management UI
> 
> +1

+1

> While there are differences in resolution/system rendering/context/etc, 11px
> is a very small default body text. (Much smaller than _11pt_.)

I don't have examples, but here are some interesting articles on the topic:

- in case you are worried that 12 is too big:
http://www.smashingmagazine.com/2011/10/07/16-pixels-body-copy-anything-less-costly-mistake/

- general accessibility info:
https://www.webaccessibility.com/best_practices.php?best_practice_id=1822
http://accessibility.psu.edu/fontsizehtml
http://www.w3.org/TR/2008/REC-WCAG20-20081211/#guidelines

-Liz C.


> 
> Just some real-world examples - OpenShift console body text defaults to 14px,
> the Patternfly site has 13px body text, the default Bootstrap body text size
> is 14px.
> 
> ----- Original Message -----
> > From: "Jeremy Perry" <jeperry at redhat.com>
> > To: "Matt Carrano" <mcarrano at redhat.com>
> > Cc: patternfly at redhat.com, "Catherine Robson" <crobson at redhat.com>
> > Sent: Tuesday, March 25, 2014 1:53:10 PM
> > Subject: Re: [Patternfly] FYI - Latest API Management UI
> > 
> > I know I’m coming out of nowhere with this, but I think looking seriously
> > at
> > 12px as a default is worth exploration. Aside from increased legibility,
> > the
> > number 12 has many benefits for creating a typographic rhythm on line
> > heights like 1.25, 1.5 etc.
> > 
> > 
> > On Mar 25, 2014, at 12:08 PM, Matt Carrano <mcarrano at redhat.com> wrote:
> > 
> > > Catherine/Eric,
> > > 
> > > Thanks for passing along the feedback.  It is great to see these screens
> > > and to know that Overload is now using PatternFly styling.  Also, good
> > > tip
> > > about the Rawgithub tool.  I can see where this can be a really helpful
> > > thing.
> > > 
> > > Regarding the font sizing, I can see what you mean about the 11pt text.
> > > This is a tricky issue because I find that readability depends a lot on
> > > monitor resolution and context.  There's probably not one right answer
> > > for
> > > all cases, and this also varies a lot from person to person. That said,
> > > it's something for us to keep in mind and I appreciate getting the
> > > feedback.  I'm copying in the PF list as others may also have thoughts
> > > who
> > > are more knowledgeable in this area than I.
> > > 
> > > -Matt
> > > 
> > > ----- Original Message -----
> > > From: "Catherine Robson" <crobson at redhat.com>
> > > To: "Matt Carrano" <mcarrano at redhat.com>
> > > Cc: "Eric Wittmann" <eric.wittmann at redhat.com>
> > > Sent: Tuesday, March 25, 2014 11:08:02 AM
> > > Subject: Fwd: Re: FYI - Latest API Management UI
> > > 
> > > Matt,
> > > 
> > > Eric is using the PatternFly font recommendations, but we both felt the
> > > font was too small to read easily.  He noted that it was 11px by default
> > > (and is what he currently has implemented), but 12px seems to be much
> > > easier to look at.  You can click on the link he provided below to see
> > > his application (without the top header area at this point).
> > > 
> > > Thought I would forward this to you for feedback on PatternFly.
> > > 
> > > Thanks!
> > > Catherine
> > > 
> > > -------- Original Message --------
> > > Subject: 	Re: FYI - Latest API Management UI
> > > Date: 	Tue, 25 Mar 2014 11:04:26 -0400
> > > From: 	Eric Wittmann <eric.wittmann at redhat.com>
> > > To: 	Catherine Robson <crobson at redhat.com>
> > > 
> > > 
> > > 
> > > Thanks for the feedback.
> > > 
> > > Regarding font size - it's funny, I thought it was too small as well,
> > > but the font size is coming from PatternFly (I think) so I assumed that
> > > was the recommended size.  I'll def. change it.
> > > 
> > > I may book an hour with you - would love some functional feedback.
> > > 
> > > -Eric
> > > 
> > > On 3/25/2014 10:48 AM, Catherine Robson wrote:
> > >> 
> > >> 
> > >> Eric Wittmann wrote:
> > >>> Just wanted to let you know that I have applied the PatternFly styles
> > >>> to my most recent project UI.  I also discovered a web site called
> > >>> "rawgithub.com" which is amazing and allows me to view the UI
> > >>> templates as webpages directly from the github source!  That's a super
> > >>> nerdy thing to be excited about, but I'm not ashamed.  :P
> > >> This is very cool!  I hate having to check stuff out and figure out how
> > >> to build it.
> > >>> 
> > >>> In any case, it means you can view the UI here (if interested) without
> > >>> downloading or checking anything out:
> > >>> 
> > >>> http://rawgithub.com/Governance/apiman/master/apiman-dt/apiman-dt-ui/apiman-dt-ui-war/src/main/java/org/overlord/apiman/dt/ui/client/local/site/user-orgs.html
> > >>> 
> > >>> 
> > >>> What you *won't* see is the header, which (like all overlord apps)
> > >>> gets added later via javascript.  So it looks a little bare without
> > >>> that, but hopefully you'll get the idea. :)
> > >>> 
> > >>> Also note that I tried to ensure that every page looks good in a
> > >>> browser but also in a phone - so that aspect of things should be
> > >>> working well.
> > >> Looking great!
> > >>> 
> > >>> Any feedback welcome.
> > >> 
> > >> The only feedback I have is that font is a bit small.  You might want to
> > >> bump the body font size up to 12px instead of 11px.  It makes it much
> > >> easier to read I think, and doesn't seem to ruin the design in any way
> > >> to me.
> > >> 
> > >> Otherwise, from a design standpoint, I think this looks good.  I have no
> > >> idea what it is supposed to be or do from a functional standpoint, so I
> > >> don't think I can comment on the usability or workflow really at this
> > >> point.  If you want to review this level of stuff, maybe book an hour
> > >> with me and we can do a walkthrough of it together.
> > >> 
> > >>> 
> > >>> -Eric
> > > 
> > > _______________________________________________
> > > Patternfly mailing list
> > > Patternfly at redhat.com
> > > https://www.redhat.com/mailman/listinfo/patternfly
> > 
> > 
> > _______________________________________________
> > Patternfly mailing list
> > Patternfly at redhat.com
> > https://www.redhat.com/mailman/listinfo/patternfly
> > 
> 
> _______________________________________________
> Patternfly mailing list
> Patternfly at redhat.com
> https://www.redhat.com/mailman/listinfo/patternfly
> 




More information about the PatternFly mailing list