You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@rave.apache.org by Kristen Legacy <kr...@gmail.com> on 2012/10/26 23:27:04 UTC
Review Request: RAVE-389 Rave Portal UI Design
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/
-----------------------------------------------------------
Review request for rave.
Description
-------
Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated.
https://issues.apache.org/jira/browse/RAVE-389
Diffs
-----
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1402666
trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1402666
trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
Diff: https://reviews.apache.org/r/7750/diff/
Testing
-------
Thanks,
Kristen Legacy
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Jasha Joachimsthal <ja...@apache.org>.
> On Oct. 30, 2012, 9:01 p.m., Stan Drozdetski wrote:
> > Looks a bit foreboding... but, if we're going in this direction:
> >
> > - IMO, the background should cover all of <body>, not stop with div.container-fluid. That way, shorter pages (on larger monitors) would still look decent. The logo in the footer would need to have a transparent background - which would be an improvement regardless. Does anyone have the original of that logo image?
> > - The blue button on the login screen clash with the new red ones... maybe make them into regular .btn buttons? I'd even turn them into links, same as what we have once you actually log in.
> > - The modal dialogs (e.g., tab menu -> edit page) have an underline on the heading (h3). The heading itself is now too dark to be visible - light gray (#E3E3E3) that we have for gadget titles would work better.
> > - Yeah, the vertical tabs on the admin screen look a bit off... partially due to the gap that keeps growing to the right of the tabs as you stretch the page. We could just create a stacked nav sidebar (similar to what you see on the Bootstrap site), or just throw a secondary horizontal navbar across the top.
There are hi-res PNGs of the logo attached to https://issues.apache.org/jira/browse/RAVE-6
I don't know if the PSD or Illustrator version of the logo is still around.
- Jasha
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/#review12917
-----------------------------------------------------------
On Oct. 26, 2012, 9:27 p.m., Kristen Legacy wrote:
>
> -----------------------------------------------------------
> This is an automatically generated e-mail. To reply, visit:
> https://reviews.apache.org/r/7750/
> -----------------------------------------------------------
>
> (Updated Oct. 26, 2012, 9:27 p.m.)
>
>
> Review request for rave.
>
>
> Description
> -------
>
> Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated.
>
> https://issues.apache.org/jira/browse/RAVE-389
>
>
> Diffs
> -----
>
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1402666
> trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
> trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1402666
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
>
> Diff: https://reviews.apache.org/r/7750/diff/
>
>
> Testing
> -------
>
>
> Thanks,
>
> Kristen Legacy
>
>
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Kristen Legacy <kr...@gmail.com>.
> On Oct. 30, 2012, 9:01 p.m., Stan Drozdetski wrote:
> > Looks a bit foreboding... but, if we're going in this direction:
> >
> > - IMO, the background should cover all of <body>, not stop with div.container-fluid. That way, shorter pages (on larger monitors) would still look decent. The logo in the footer would need to have a transparent background - which would be an improvement regardless. Does anyone have the original of that logo image?
> > - The blue button on the login screen clash with the new red ones... maybe make them into regular .btn buttons? I'd even turn them into links, same as what we have once you actually log in.
> > - The modal dialogs (e.g., tab menu -> edit page) have an underline on the heading (h3). The heading itself is now too dark to be visible - light gray (#E3E3E3) that we have for gadget titles would work better.
> > - Yeah, the vertical tabs on the admin screen look a bit off... partially due to the gap that keeps growing to the right of the tabs as you stretch the page. We could just create a stacked nav sidebar (similar to what you see on the Bootstrap site), or just throw a secondary horizontal navbar across the top.
>
> Jasha Joachimsthal wrote:
> There are hi-res PNGs of the logo attached to https://issues.apache.org/jira/browse/RAVE-6
> I don't know if the PSD or Illustrator version of the logo is still around.
>
> Ate Douma wrote:
> I've checked in the RAVE-6 logo PSD, see: http://svn.apache.org/repos/asf/rave/etc/design/site/RAVE-6-rave-logo-def-psd.zip
Hey Stan, thank you for the feedback! I'm with you on everything- but adding the color to the solid background to body. The gap is definitely unattractive, but not sure having the body background solid gray is the right option either. I've got the gradient on the body (seen in the widget store) - and the solid color is on the tabs content. I can lose the gradient, but then it will be a whole lot of gray, plus the tabs themselves will blend into the background or they have to be a different color and we run into the same problem. I might be digging myself a whole here, but I think the best solution would be to implement a sticky footer, that way the site is always taking up the full height. There will still be a gap between the end of the tab and the footer, but a border &/or drop shadow on the bottom of the tab container and no background on the footer might work?
I did try converting the vertical tabs into horizontal and it does the job, but I like the stacked nav idea, I'll give that a whirl.
Jasha & Ate - thanks for hunting down the logo psd!
- Kristen
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/#review12917
-----------------------------------------------------------
On Oct. 26, 2012, 9:27 p.m., Kristen Legacy wrote:
>
> -----------------------------------------------------------
> This is an automatically generated e-mail. To reply, visit:
> https://reviews.apache.org/r/7750/
> -----------------------------------------------------------
>
> (Updated Oct. 26, 2012, 9:27 p.m.)
>
>
> Review request for rave.
>
>
> Description
> -------
>
> Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated.
>
> https://issues.apache.org/jira/browse/RAVE-389
>
>
> Diffs
> -----
>
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1402666
> trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
> trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1402666
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
>
> Diff: https://reviews.apache.org/r/7750/diff/
>
>
> Testing
> -------
>
>
> Thanks,
>
> Kristen Legacy
>
>
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Ate Douma <at...@douma.nu>.
> On Oct. 30, 2012, 9:01 p.m., Stan Drozdetski wrote:
> > Looks a bit foreboding... but, if we're going in this direction:
> >
> > - IMO, the background should cover all of <body>, not stop with div.container-fluid. That way, shorter pages (on larger monitors) would still look decent. The logo in the footer would need to have a transparent background - which would be an improvement regardless. Does anyone have the original of that logo image?
> > - The blue button on the login screen clash with the new red ones... maybe make them into regular .btn buttons? I'd even turn them into links, same as what we have once you actually log in.
> > - The modal dialogs (e.g., tab menu -> edit page) have an underline on the heading (h3). The heading itself is now too dark to be visible - light gray (#E3E3E3) that we have for gadget titles would work better.
> > - Yeah, the vertical tabs on the admin screen look a bit off... partially due to the gap that keeps growing to the right of the tabs as you stretch the page. We could just create a stacked nav sidebar (similar to what you see on the Bootstrap site), or just throw a secondary horizontal navbar across the top.
>
> Jasha Joachimsthal wrote:
> There are hi-res PNGs of the logo attached to https://issues.apache.org/jira/browse/RAVE-6
> I don't know if the PSD or Illustrator version of the logo is still around.
I've checked in the RAVE-6 logo PSD, see: http://svn.apache.org/repos/asf/rave/etc/design/site/RAVE-6-rave-logo-def-psd.zip
- Ate
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/#review12917
-----------------------------------------------------------
On Oct. 26, 2012, 9:27 p.m., Kristen Legacy wrote:
>
> -----------------------------------------------------------
> This is an automatically generated e-mail. To reply, visit:
> https://reviews.apache.org/r/7750/
> -----------------------------------------------------------
>
> (Updated Oct. 26, 2012, 9:27 p.m.)
>
>
> Review request for rave.
>
>
> Description
> -------
>
> Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated.
>
> https://issues.apache.org/jira/browse/RAVE-389
>
>
> Diffs
> -----
>
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1402666
> trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
> trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1402666
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
>
> Diff: https://reviews.apache.org/r/7750/diff/
>
>
> Testing
> -------
>
>
> Thanks,
>
> Kristen Legacy
>
>
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Stan Drozdetski <dr...@mitre.org>.
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/#review12917
-----------------------------------------------------------
Looks a bit foreboding... but, if we're going in this direction:
- IMO, the background should cover all of <body>, not stop with div.container-fluid. That way, shorter pages (on larger monitors) would still look decent. The logo in the footer would need to have a transparent background - which would be an improvement regardless. Does anyone have the original of that logo image?
- The blue button on the login screen clash with the new red ones... maybe make them into regular .btn buttons? I'd even turn them into links, same as what we have once you actually log in.
- The modal dialogs (e.g., tab menu -> edit page) have an underline on the heading (h3). The heading itself is now too dark to be visible - light gray (#E3E3E3) that we have for gadget titles would work better.
- Yeah, the vertical tabs on the admin screen look a bit off... partially due to the gap that keeps growing to the right of the tabs as you stretch the page. We could just create a stacked nav sidebar (similar to what you see on the Bootstrap site), or just throw a secondary horizontal navbar across the top.
- Stan Drozdetski
On Oct. 26, 2012, 9:27 p.m., Kristen Legacy wrote:
>
> -----------------------------------------------------------
> This is an automatically generated e-mail. To reply, visit:
> https://reviews.apache.org/r/7750/
> -----------------------------------------------------------
>
> (Updated Oct. 26, 2012, 9:27 p.m.)
>
>
> Review request for rave.
>
>
> Description
> -------
>
> Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated.
>
> https://issues.apache.org/jira/browse/RAVE-389
>
>
> Diffs
> -----
>
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1402666
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1402666
> trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
> trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1402666
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
>
> Diff: https://reviews.apache.org/r/7750/diff/
>
>
> Testing
> -------
>
>
> Thanks,
>
> Kristen Legacy
>
>
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Matt Franklin <mf...@apache.org>.
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/#review14048
-----------------------------------------------------------
What is the status of this request?
- Matt Franklin
On Oct. 31, 2012, 6:36 p.m., Kristen Legacy wrote:
>
> -----------------------------------------------------------
> This is an automatically generated e-mail. To reply, visit:
> https://reviews.apache.org/r/7750/
> -----------------------------------------------------------
>
> (Updated Oct. 31, 2012, 6:36 p.m.)
>
>
> Review request for rave.
>
>
> Description
> -------
>
> Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated. I tried to keep the changes to templates themselves to a minimum but some were necessary.
>
> https://issues.apache.org/jira/browse/RAVE-389
>
>
> Diffs
> -----
>
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/common/footer.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/templates/base_layout.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/includes/login-navbar.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/admin_tabsheader.tag 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/login_navbar.tag 1404128
> trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1404128
> trunk/rave-portal-resources/src/main/webapp/static/css/rave-css.less 1404128
> trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
> trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1404128
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.png UNKNOWN
> trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo.png UNKNOWN
>
> Diff: https://reviews.apache.org/r/7750/diff/
>
>
> Testing
> -------
>
>
> Screenshots
> -----------
>
> Admin with stacked nav
> https://reviews.apache.org/r/7750/s/8/
> Admin w/ horizontal nav
> https://reviews.apache.org/r/7750/s/9/
>
>
> Thanks,
>
> Kristen Legacy
>
>
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Kristen Legacy <kr...@gmail.com>.
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/
-----------------------------------------------------------
(Updated Oct. 31, 2012, 6:36 p.m.)
Review request for rave.
Changes
-------
Added sticky footer, revised page tabs and replaced admin vertical tabs with stacked.
Description
-------
Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated. I tried to keep the changes to templates themselves to a minimum but some were necessary.
https://issues.apache.org/jira/browse/RAVE-389
Diffs (updated)
-----
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/common/footer.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/templates/base_layout.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/includes/login-navbar.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/admin_tabsheader.tag 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/login_navbar.tag 1404128
trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1404128
trunk/rave-portal-resources/src/main/webapp/static/css/rave-css.less 1404128
trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1404128
trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.png UNKNOWN
trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo.png UNKNOWN
Diff: https://reviews.apache.org/r/7750/diff/
Testing
-------
Screenshots
-----------
Admin with stacked nav
https://reviews.apache.org/r/7750/s/8/
Admin w/ horizontal nav
https://reviews.apache.org/r/7750/s/9/
Thanks,
Kristen Legacy
Re: Review Request: RAVE-389 Rave Portal UI Design
Posted by Kristen Legacy <kr...@gmail.com>.
-----------------------------------------------------------
This is an automatically generated e-mail. To reply, visit:
https://reviews.apache.org/r/7750/
-----------------------------------------------------------
(Updated Oct. 31, 2012, 5:38 p.m.)
Review request for rave.
Changes
-------
Added a couple screenshots of the vertical nav replacement options.
Description (updated)
-------
Took the main gist from the screenshots and created a skin from them. Attaching the image file incase applying the diff doesn't cut it. I'm not sure I like the left tabs (used in admin interface) but ran out of inspiration! Suggestions/criticism greatly appreciated. I tried to keep the changes to templates themselves to a minimum but some were necessary.
https://issues.apache.org/jira/browse/RAVE-389
Diffs
-----
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/addwidget.w3c.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/store.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/widget.jsp 1402666
trunk/rave-portal-resources/src/main/webapp/WEB-INF/tags/navbar.tag 1402666
trunk/rave-portal-resources/src/main/webapp/static/css/rave-skin.less PRE-CREATION
trunk/rave-portal-resources/src/main/webapp/static/css/rave.less 1402666
trunk/rave-portal-resources/src/main/webapp/static/images/rave-logo-sm.jpg UNKNOWN
Diff: https://reviews.apache.org/r/7750/diff/
Testing
-------
Screenshots (updated)
-----------
Admin with stacked nav
https://reviews.apache.org/r/7750/s/8/
Admin w/ horizontal nav
https://reviews.apache.org/r/7750/s/9/
Thanks,
Kristen Legacy