Designing MetroTwit for Windows 8

The “preview” version of MetroTwit for Windows 8 is finally available in the Windows Store.

We know it’s still a bit rough around the edges and not feature complete but we hope it offers a teaser of what we think will be a compelling Twitter app for Windows 8 users.

Designing MetroTwit for Windows 8 was no walk in the park. We couldn’t simply copy and paste our desktop application’s source code; WPF code doesn’t port to WinRT as well as you may have heard. But regardless, that code wasn’t designed for touch. A tough challenge to say the least.

Fortunately we had the opportunity to work with some experienced Microsoft folks who provided invaluable feedback to form the design you see today. It’s a whole new (and better) app from the ground up.

On the home screen, you will find a simple but powerful multi-column layout that allows you to keep tabs on multiple conversations at once. Our in-app live tiles provide at-a-glance and one-tap access to all the stuff you care about on Twitter. This combination should satisfy the needs of both casual and professional Twitter users.

To maximize screen real-estate and functionality, we hide most tweet options and action buttons in the application bar. This bar only appears when additional functionality is available.

We also implemented an app-wide tweet compose window. This window is layered on top of whatever you’re doing, allowing you to still interact with the page underneath. You won’t need to remember the entire tweet conversation you’re responding to.

Mouse support in Metro also presents a whole new set of challenges. We designed for both mouse and touch from the start and believe we found a good balance between the two in terms of usability.

We are proud to be one of the first applications that have built-in support for “edge scrolling”, that is, a type of horizontal scrolling triggered by the mouse when it reaches a vertical screen edge (as seen in the Start Screen). We believe this is a necessity for mouse usability in a panoramic Metro experience.

MetroTwit for Windows 8 also includes a comprehensive and almost no-compromise Snap view. Snap is a killer new feature in Windows 8 and having the app docked beside Internet Explorer or the desktop works great.

We still have a lot of work ahead of us but feel free to give the preview version in the Windows Store a whirl. We definitely want to hear from all our users to help shape the future of MetroTwit.

42 insightful thoughts

  1. I think this app is at the very top of every Metro app release thus far, and is a definitive experience for any Windows 8 user. Inspired by your dedication to the Snapped view, I plan to design every screen possible to use a snapped state in my own apps.

    I now feel slightly sorry to all those Windows 8 haters out there, who will never experience this awesome app!

  2. *puts rowi to bed*

    This is a brilliant application, Long. You and the team should be extremely proud of what you’ve achieved, and I can’t wait to see what is in store for you over the next few years.

  3. Stunning look app. Loved it. Wish I could use my Lists as columns like I today can on Tweetdeck. Looking forward to more features in the weeks ahead.

  4. The app is great. Obviously not feature complete by any stretch of the imagination, but the layout and performance of the app is top notch.

    Really looking forward to more features filling out the app in the future.

  5. I just wanted to say THANK YOU for the mouse edge scrolling!

    When I opened the app and saw that it had edge scrolling in, I was so relieved because it really is something that every Metro app needs. I think the large majority of frustration people have with Metro apps when using a mouse and keyboard is the lack of edge scrolling, and simply adding it would calm peoples anxiety about using them.

    Awesome work, can’t wait to see the finished product!

  6. Nice! Would be nice to be able to move the timeline list to an edge so I can thumb scroll while holding a slate from each side in landscape mode.

  7. I was expecting a 6000-word long Sinofsky-style post explaining the philosophy of the design behind MetroTwit :P

    But in all seriousness, this is probably one of the best Twitter apps in the Store, now I can uninstall Rowi. The “edge scrolling” (plus actual proper mouse-wheel scrolling across the panorama) is really helpful and it’s usually these small things that matters.

  8. Is edge scrolling something you had to implement manually, or is there a built in feature to provide that style to applications?

  9. Wow, I’m very impressed. It looks and feels very slick; I’m doing WinRT development myself at the moment and I know it takes a lot of care and effort (and blood) to make your app feel as nice as MetroTwit looks and feels. Congratulations! I’m looking forward to more features soon (lists and more than three columns on the main page).

    1. You get more than three columns if your screen is of high-enough resolution. Long didn’t even mention the adaptive layout, which is very impressive.

  10. Ah! Finally! A really beautiful and sensibly designed Twitter Metro Style app. Thanks guys!

    P.S: I think Microsoft calls it ‘Kinetic scrolling’ and yeah it totally is required. For some absurd reason the Store itself doesn’t support it. Kudos to you guys becuase using a metro app with the mouse just became a hell of a lot better.

  11. Thank God!! This is an amazing twitter app, even in the preview stage (I have been lamenting the terrible twitter app options on Windows 8). It’s absolutely beautiful!

    If I may make 2 feature requests: adding a column or some way to have twitter trends (optionally) viewable/displayed without having to go to search, and a way to view images/videos inline, similar to the twitter web page.

    Thanks again for this app, and keep up the great work!

  12. Very good app, great work!

    Two questions, though. First, I don’t seem to be able to scroll down the tweets in a column using the scroll gesture of my touchpad of my laptop, is that supposed to work or is it my problem? I can only use the scroll bar, which is frustrating. Second, is it possible to have more than two columns? I can only have the timeline and an extra column.

  13. I decided to come here for some feedback rather than post it in the Windows Store as a review – I really do not like seeing app feedback/critique, especially on a preview, in the store reviews.

    First the app looks great on my desktop – I really like the flexible columns adjustment, etc. Need to install this on my tablet as well to check it out in touch mode. Also, memory usage is superb – less than 85MB for me compared to over 300MB on the desktop version.

    Anyway, some suggestions as you all continue the dev work on MetroTwit for Windows 8:

    - List Support (Long already said this was in works via Twitter last night)
    - Mark a column as read when it is clicked on in the Profile Column. Currently you have to click on a tweet in that column, which brings up the app bar, and then click it again to mark them as read. Unless of course I am missing something.
    - Why is there only Reply All on the app bar and no Reply? I know they do the same thing but shouldn’t there be a choice in case you want the reply to just go to the originator of the tweet?
    - Should edge scrolling work when you are viewing columns on the main page of the app? Works in profiles but not there. Also edge scrolling on dual monitors does not work well on the shared monitor side. Have to move the mouse back and forth on that pixel line to get it to move (stutters as it does).

    For down the road:

    - Customized URL shorteners/popular URL shorteners options
    - Option for picture service selection from the popular ones
    - Multiple accounts

    Again appreciate the opportunity to give some feedback – keep up the great work.

    1. Thanks for the thoughts. Pretty much everything is already on our list, the idea is to as much as possible have feature parity between the Desktop and the Windows 8 versions.

      With Reply All, we highlight the other uses mentioned in the tweet so if you only want to reply to one it’s as simple as typing over them.

      Edge scrolling, this works on any page can scroll horizontally, this is most pages except the main page which has a special screen resolution dependent screen. We’ll look into the stuttering of the edge scrolling as well.

  14. Really like the overall smoothness of the app, especially the infinite scrolling on the timeline is great (I’ve never seen it this fast). I’d like a browser window inside the app though (like on the twitter app on the iPad).

  15. It doesn’t seem to work using the keyboard on my laptop. I’d like to use the mouse up/down keys to select the next tweet up/down within a column. What it does now is select the item that it is on (shows a checkmark). This is not a) what I would expect and b) blocks useful navigation with up/down keys. I’d be just as happy with page up/down working too. Please don’t forget about keyboard / mouse users.

  16. Very promising app. My only real complaint is the limited number of columns on-screen. In the desktop version of MetroTwit I have 5 columns which display all the info I need. In the Win 8 version I can only have 3 columns which makes the app less usual to me for the at-a-glance way I use it. It’d be great if the left hand menu could have an option to shrink it like the one in the desktop version so that I can reclaim that screen real estate.

    Definitely the best Metro app I’ve seen though (and that is coming from someone who does not like the concept of Metro apps!).

  17. Hello Long,

    Would love to see MetroTwit in the Dutch version of the Windows 8 store, currently I’m lacking a decent Windows 8 style twitter client. Any thoughts on when it would be available in the Dutch store?

Leave a Reply