3.23 KB, image/png
2.99 KB, image/png
1.46 KB, image/png
7.74 KB, image/png
38.83 KB, image/png
36.60 KB, image/png
Currently, the experience when using Army of Awesome is not consistent with the rest of SUMO. As we are undergoing a visual redesign, expect some sort of an adaptation of that visual design into the Army of Awesome interface. I think a good first step is to erase a lot of the font-family and color values, rather than adding things. This way, not only will they revert to the values that the rest of SUMO uses. They will also look consistent when we switch to the new set of stylesheets later this year.
Some quick changes to make first: .kbox-title * Erase font-family #twitter-modal * Erase font-family * Erase color #speech-bubbles li * font-family: Georgia, serif; #tweetcontainer h2 * Erase font-size * Erase font-weight * line-height: 2em; * font-style: italic; #tweets li .twittername * color: #0051B9; #tweets li .reply_count, #tweets li .remove_tweet * color: #0051B9; * font-size: 13px #tweets li time, #initial-tweet time * color: #aaa; * Erase font-style
Created attachment 636432 [details] Sign in with Twitter (Darker Style) Twitter prefers applications to use this button. Source: https://dev.twitter.com/docs/sign-twitter-resources
Created attachment 636437 [details] Twitter Bird, 48px This is to replace the ‘t’ wordmark to the left of “Choose a tweet to help”. This will help make AoA look more consistent with Twitter.
Bram, this all looks great! (In reply to Bram Pitoyo [:bram] from comment #2) > Twitter prefers applications to use this button. Will we be localizing the text on this button? Or is it alright if this button is English only?
(In reply to William Reynolds [:williamr] from comment #5) > Bram, this all looks great! > > (In reply to Bram Pitoyo [:bram] from comment #2) > > Twitter prefers applications to use this button. > > Will we be localizing the text on this button? Or is it alright if this > button is English only? (In reply to William Reynolds [:williamr] from comment #5) > Bram, this all looks great! > > (In reply to Bram Pitoyo [:bram] from comment #2) > > Twitter prefers applications to use this button. > > Will we be localizing the text on this button? Or is it alright if this > button is English only? Now that I took a second look at the image, it still uses the old logo, and the color doesn’t fit with Twitter’s new color scheme, either. I guess the best option is to use the same blue button style currently in use on Twitter.com (attached), or use our own button. The most important principle here is to make the style consistent across SUMO.
Created attachment 636876 [details] Proposed timeline This is what the timeline should look like. Twitter’s timeline display guideline is located here: https://dev.twitter.com/terms/display-guidelines Other than lots of font size and spacing changes (which should more closely matches Twitter’s), I also modified the “Reply” so that it is located on the bottom of the Twitter message, and put the real name of the user ahead of his/her @username. Please note that the “Reply” will only appear when user mouses over a particular tweet.
Created attachment 636878 [details] Current timeline For comparison to the proposed timeline (attachment 636876 [details]), here’s the timeline currently in use on Army of Awesome. The proposed timeline not only has more breathing room, it also conforms to Twitter’s display guidelines.
Please note that on the proposed timeline (attachment 636876 [details]), the second user should have had the @username displayed after the real name. In the mockup, I had forgotten to do the same. Unfortunately, I made the mockup with Firebug, so it’s unfixable for the time being.
This all looks great Bram - thanks!
Bram, I am assuming you will have a bunch of changes related to the whole redesign. I am assigning to you until that is ready then we'll pick it up. (No rush we have our hands full doing redesign stuff but just wanted to get this back on your radar.)
Assignee: nobody → bram
Priority: -- → P2
Summary: [tracker] Army of Awesome visual design refinements → [redesign] Army of Awesome visual design refinements
Whiteboard: u=contributor c=AoA p=
Target Milestone: --- → 2012Q3
This design was going to finish much earlier, before the new visual design got implemented. Now, it’s better if I just skin AoA with the new style. I plan to get this done after the forum and AAQ design work.
Summary: [redesign] Army of Awesome visual design refinements → [redesign] Army of Awesome
There is a mockup in bug 762255. Bram, is that final? We need to make sure we follow all the new twitter rules as far as display goes. They are changing the Display Guidelines to be Display Requirements: https://dev.twitter.com/blog/changes-coming-to-twitter-api We may also have to redo some of the API code, but that is for another day and bug.
Target Milestone: 2012.17 → 2012Q3
(In reply to Ricky Rosario [:rrosario, :r1cky] from comment #14) > There is a mockup in bug 762255. > > Bram, is that final? Hi Ricky, Because the display guideline will turn into display requirement, I will need to tweak the design, but by just a little bit. I was already designing to follow the guideline closely, so the only thing I need to add is the reply icon, as well as the links to retweet and favorite. Retweet and favorite isn’t going to be relevant to AoA, but a requirement is a requirement. I’ll post the change to the bug shortly. That attachment will be the final design. FYI, this is the blog post that details changes to the Twitter API: https://dev.twitter.com/blog/changes-coming-to-twitter-api
(In reply to Bram Pitoyo [:bram] from comment #15) > Retweet and favorite isn’t going to be relevant to AoA, but a requirement is > a requirement. Yeah, this is unfortunate and out of scope for this round because we need to implement those features :-/
(In reply to Ricky Rosario [:rrosario, :r1cky] from comment #17) > Yeah, this is unfortunate and out of scope for this round because we need to > implement those features :-/ I think we should be good for now to just implement the Reply button only. We can add retweet and favorite, which is not that important as a feature anyway, later.
Based on similar bugs from the redesign, this is a 3pt. There is a lot of modals, etc that we need to update.
Whiteboard: u=contributor c=AoA p= → u=contributor c=AoA p=3
Grabbing this one.
Assignee: nobody → rrosario
Rehan mentioned he started this and really really wanted to work on it :-)
Assignee: rrosario → rdalal
There will be parts that my design will miss, so let me know what needs to be designed further :)
Rehan landed last week and I just deployed to prod: https://github.com/mozilla/kitsune/commit/d756e15109d8006b0407e9768822aba99a0d5986
Status: NEW → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.