I agree with Stephen, we should definitely see if it still fits in with Lion, although I doubt the UI changes will be so drastic so as to make all existing software for OS X feel like it doesn't fit. This is what would need to happen for George's UI suggestions above to not 'fit' with Lion.
I love this UI refresh from George - it's definitely got that fresh new look that tons of software projects have been sporting with their bigger updates that Adium hasn't really done in many years. (Panic's Unison, Evernote, Skype Beta, etc.) The only part I'm not sold on is the character count bubbles. I think these are excellent for services like Twitter where watching your characters is an important part of the tweeting process. When writing IMs I don't believe this is nearly as important. If it were to be implemented for all services, I would suggest only showing the indicators when you draw near the limit, otherwise they may be felt as intrusive. Cheers, Jordan On Tue, Nov 23, 2010 at 6:23 PM, Stephen Holt <stephen.h...@gmail.com> wrote: > Might we want to wait and see what, if any, UI updates are coming with 10.7 > before we expend a lot of effort updating our UI look and feel? > I agree it needs an update, but it'd be nice to get a closer (as in: hands > on) look of where the OS is going with UX and visual style. > Just my 2¢. > -- > Steve Holt > On Nov 23, 2010, at 1:40 PM, George Lambrou wrote: > > For the most part, this is the same as my post last week in the icon update > thread, however, the difference here is that I've added a new message > composition bar and source & destination handling; I'm working on horizontal > tabs, and I plan to show them as well as the new chat creation/joining UI > I've proposed below in another mockup soon. Anyway, here are my proposed > mockups and feature breakdown for vertical tabs and a new message > composition view: > <Adium NUI Mockup.png><Chat Source OR Destination.png><Chat Source AND > Destination.png> > > The New Look: the updated look of the tab bar is inspired somewhat by iChat, > while adding a little more functionality to the mix, mainly in the form of > indication; I thought we could make vertical tabs act more as an HUD of > sorts, so that users can see what's happening within the window at a glance. > Status on Hover: I thought that we could use hovering to better show contact > status, by grabbing the colours used by the contact list for contact > statuses, and using them as the semitransparent background colour for the > hovered tab. My tab demonstrates this in the mockup using the default online > green from Aqualicious. > Close Button on Tab Hover: at first glance, it may not be obvious to new > users that you click the tab's status icon to close it; by making the close > button appear when hovering over the tab instead of just the status icon, we > can more quickly get new users used to using Adium. > File Transfer Indication: Valerie's tab features an arrow and circular > progress indicator, which represent a file transfer in progress; the > direction of the arrow represents the transfer's direction (up for sending, > down for receiving), while the pie represents its completion. I'm still > considering two ideas for handling duplex transfers to the same contact: two > indicators stacked on top of each other, or a single, two way arrow. > Other Indicators: I've added voice and video indicators to both Karl's and > Danielle's tabs, inaccurately showing all of their states so you can see how > they look. Danielle's tab also has an unread messages indicator, which has > been slightly altered to fit in with the rest of OS X. > Tab View Bottom Bar: The bottom bar allows users to create a new chat, join > group chats (the merging arrows button; anyone have a better glyph for > this?), and see how many they currently have open. > Message Bar: The aesthetic of the new message bar draws inspiration from the > Messages app on iPhone. The size of the splitter target is larger than it > was previously, and a handle has been added for increased clarity. > Character Count Bubble: A character count appears above the text cursor as > the user types. It fades away after a set (user definable?) interval, unless > the user has exceeded the character limit, in which case the bubble turns > red, and stays visible until the user fixes the issue; the user would also > be prevented from sending the message by hitting Return. The full window > mockup (again, inaccurately) demonstrates the counter in both of these > states. Would it be possible to implement this for more than just Twitter, > instead of the currently standard notification in the message view on other > services? > Chat Source and Destination Placement: I think that moving the chat source > and destination fields to the composition area would help make them more > visible to the user than sticking them above the message view; instead of > being out of the way at the top of the window, they would be in the first > place the user looks when they start a new chat. > Placeholder Instructions: Adding some placeholder instructions to the > composition field while it's empty would be a great help to new users. It > would be another string to localize, but I think it'd be worth it here. > Proposed Handling of Chat Creation/Joining: Instead of presenting users with > a dialogue box, which then spawns a new window or tab, I propose that we > move chat creation functionality into the messages window; this, combined > with the tab view's bottom bar, allows the user to manage chat creation. No > mockup for this yet. > Animation: I think the message window refresh would be a great opportunity > to add a little more animation to the user interface. Small touches, like > sliding the source and destination pickers in and out of the window, or > fading new tabs in from the side, can give the UI a more dynamic feel, as > well as a bit of eye candy to delight users. > > So that's it for now. If you guys like the direction, I'd be happy to help > in any way that I can. All thoughts are welcome and appreciated, and thank > you again for considering my work. :) > George Lambrou >
