Voice (and Video)

[George Lambrou]

Okay, I've taken some time to clean up my mockups, rethink a few things, take into consideration some of the feedback I've seen on the list, and add stuff I omitted earlier; I apologize for what was previously a rush job on my part. Here's my proposal for video chat, take two:

Video in the Messages Window
I've used the mockups I posted in the Message Window Update thread as a base; I hope no one minds.
Retractable Message View: When a video chat is activated and is supposed to take place within the messages window, the message view retracts to just the message bar at the top of the window, and the text in the box changes to instructions for seeing the chat again. When the user tries to enter text in the bar, the message view slides down, covering some (but not all) of the video view, and the user can send messages as they normally would. Clicking outside the message view causes it to retract again.
Video Area & Hovering Controls: The user is presented with an incoming video view (scaled to fit within the window) atop an iPad-style linen background (if needed). The control bar at the bottom only appears if the user hovers over the video area, and the "Hide Preview" control in the outgoing video box only appears if the user hovers over the preview box. The control bar is positioned within the incoming video view, to maintain its relationship to it, while the user's video preview is positioned within the entire video area of the main window, to prevent as much overlapping of the two videos as possible.
User Preview: The user can move their preview around, to whichever corner they choose. When the Hide Preview button is clicked, the outgoing view collapses into the "Show Preview" button you'll see in the top right corner of the video view. Only one of the hide or show controls is visible at any given time, and they don't change corners unless the user drags the preview box; I just put both in the mockup for demo purposes.
Control Bar: The buttons in the control bar are (from left to right) effects, pause, end call, enter fullscreen mode, and undock. And, speaking of undock…

Standalone Video Window
Basically, it's the same as the inline view, but all on it's own in the middle of the user's desktop.
Title Bar: The title bar, like FaceTime's and the control bar, is only visible when the user hovers over the video window. Unlike FaceTime's, I chose to give it what I think is a much subtler design; instead of a near-opaque black gloss look, I chose to give it a lighter, translucent gradient design. I haven't designed the close, minimize, and zoom buttons for it yet; I ripped the ones you see in the mockup out of the QuickTime X player (that's okay for the mockup, right?). Lastly, when the title bar fades into view, if the user's preview or show preview button in a top corner, it'll slide out of the way, again like FaceTime.

Video Effects (mockup coming soon)
Like the ones iChat offers. When selecting one, the incoming video fades out of view, while the outgoing preview spawns eight copies of itself, all of which loose their white borders and slide into a 3 by 3 grid displaying the various effects available against a linen background; an iOS-style page indicator would appear at the bottom of the window, along with left and right buttons at the sides of the window. Click an effect, and the other previews disappear, while the chosen preview regains a white border, slides back to the user's preferred corner, and the incoming video fades back into view.

I'll post the mockup for effects later, I figured that the video handling itself was more important right now. I just hope no one minds that my proposal is a lot like FaceTime; Apple's done it well, and I think we should follow their example in some respects. Anyways, as usual, all feedback is appreciated, and thank you for considering my ideas.

George Lambrou
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20110202/c887acb1/attachment-0002.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Video Inline.png
Type: image/png
Size: 135608 bytes
Desc: not available
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20110202/c887acb1/attachment.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Standalone Video Window.png
Type: image/png
Size: 139727 bytes
Desc: not available
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20110202/c887acb1/attachment-0001.png>