1. 18

So I’ve been working on a Lobsters iPhone app over the past day or so and I think I’m going to turn it into a full blown app. I’ve been working with jcs to get a basic JSON API going that I can build this on top of and we’ve already got a basic version working that lets you browse links on the front page and newest sections.

Right now I’ve got a few design things to work out while jcs tries to find time to improve the API. I thought it’d be a good idea to get the feedback of everyone here on the issues I’ve run into, see the linked GitHub issue. I’ve always liked Lobsters' clean aesthetic so I’m trying for something similar with the app:

Mockups so far

  1.  

  2. 2

    I like it. Do you think little voting arrows are an artifact of a mouse and not very touch friendly? I know you can swipe to vote but what about down and unvoting? All in all great job though. Can’t wait until it hits the App Store. You planning on free?

    1. 2

      Swipe right to upvote or undownvote, left to downvote or unupvote maybe? Long tap to send to instapaper?

      1. 1

        That’s one way I’m thinking of approaching it, Clear and Twitterrific 5 have made me a huge fan of using those swipe gestures to act on an item. Another approach would be the Tweetie 2 style interaction where you slide a cell off to the right to reveal buttons behind it, but I’ve never been a huge fan of that interaction.

      2. 1

        The arrows here do still serve a purpose in letting you know whether you’ve voted on a story, but tapping them does nothing. I’ve been trying to come up with a better way to show users they’ve voted on a story that’s better suited to the touch-based context with no luck so far. I’m curious if anyone else has a good idea how this could be handled.

        Also as far as price I’ll probably charge $1-2 for it although the project will remain entirely open-source.

        1. 2

          I hate to mention BaconReader again, but it solves this problem by lightly coloring the background of voted stories. Light orange is used for a positive vote, and light blue is used for a downvote.

          1. 1

            I think that works well for Reddit where those arrows already have a strong correlation to certain colours, but here both upvote and downvote arrows are red. Maybe a very light yellow background on stories you’ve vote up and faded text on ones you’ve voted down? I think that would be enough to visually emphasise/deemphasise them. I’ll try mocking it up later.

            1. 3

              Okay I quickly mocked it up, here’s what that might look like, the arrows are still there because I didn’t have to time to go through and delete them all but I’ll probably get rid of them entirely now.

              1. 1

                Nice! I like that

      3. 2

        For nested comments, I would suggest a layout similar to BaconReader, an Android app for Reddit. It would awesome if we added OAuth to lobsters so I could easily give this app access to my account.

        1. 2

          Yeah I’m thinking my initial implementation may be just to indent them, but I’d like to find a way that’s better suited to a narrow screen such as the iPhone’s.

        2. 2

          Looks cool! I have one request with regard to comments.

          It’d be nice to have a way to expand/collapse comment threads. Sometimes you’ve just had enough of a certain thread and would like to quickly navigate to the next top-level comment.

          This is especially important on iOS as space is limited and posts with many comments require you to scroll a long ways between top-level comments.

          1. 1

            Collapsable comments would be super handy I agree. I wonder what an effective UI for doing that looks like.

          2. 2

            This is just an idea, but perhaps instead of having a tab bar with only two tabs, just have a segmented control on top? Also, the font is too thin, making it hard to read. Glad to see someone working on this!

            1. 1

              The tab bar will probably get other tabs as the API expands (think messages, profile, etc.) so I think this is the right design for now. As far as Helvetica Light being used as the app’s font I’m definitely considering changing that, due to the lack of subpixel font rendering on iOS it looks a little too thin for my liking.

            2. 1

              Looks great! Is this native? Or a UIWebView with Ratchet?

              1. 1

                Totally native! I’ve worked with Ratchet and Ember.js before to make an iPhone app and found it noticeably harder than simply doing a native app. You basically have to build your UI from scratch.