Visual Feeder

Posted in Design by André Souza on 15 November, 2010

Visual Feeder 11 – Mockups

(This is the first post in a series documenting the making of our Android concepts. Look out for the second instalment tomorrow morning.)

As a designer and visual creative, I always wanted a way of checking my image based feeds on my mobile phone. Surprisingly, until very recently, there was no app specifically designed for that task.

In one of our Friday brainstorms on mobile, I shared my frustration. That's how the idea started: as my desire to address that problem.

If there was such an app, what would it be like?

Then came the Android Challenge. Through October, each one of us was responsible for fleshing out and visualising a concept for an Android app. The initial idea could come from anywhere. Well, I had this one buzzing in my head for some time, so no second thoughts, it had to be it.

I started by structuring the idea the simplest version in text, outlining the overall concept, the features and the possible usage scenarios. After showing that to a few people and hearing their feedback, I moved on to the first sketches.

As an iPhone user, I had to spend a few days familiarising myself with the Android interface. At this point, I realised it'd be useful for everybody in the team to have a nice standard Android sketch sheet, so I made one. Using a Motorola Droid illustration in actual size on an A3 sized paper, everybody could sketch with more freedom.

You can download the sketch sheet. Then, it was all about pencil and paper.

Visual Feeder 01 Visual Feeder 02 Visual Feeder 03 Visual Feeder 04 Visual Feeder 05 Visual Feeder 06

After doing countless sketches on paper, trying to exhaust all the possible interactions, I was finally satisfied with the wireframes enough to proceed to the visual design. I coupled Adobe Illustrator and Keynote for this phase. I used Illustrator for the UI design and Keynote for mounting and visualising the mockups in sequence. There was not much of a method at this point. All I knew is that it had to be dark and simple, so the focus and visual energy could be always kept on the images.

Visual Feeder 07 – Splash Screen Visual Feeder 08 – Launching Board Visual Feeder 09 – Add Source Visual Feeder 10 – Controls

After several hours overnight, on a single sprint solely for the visual design, I was able to meet the deadline for the next morning.

I really enjoyed developing Visual Feeder. If you have any suggestions or feedback, please leave a comment, I'd love to hear them. I can't wait to have Visual Feeder for real!

Comments

  1. Default-avatar

    Chris Thomas

    15 November, 2010

    Great stuff Andre! Love the drawings. Really cool.

  2. Default-avatar

    Dan W

    16 November, 2010

    Those Android sketch sheets look neat. Any plans to release and share them?

  3. Picture

    Jose Azanza Arias

    19 November, 2010

    I like this idea very much. I also made some sketches for an iphone app that's is the same. I like to see someone else is looking for an app that solves our creativity needs for daily inspiration.

Add your comment

  1. | Connect with Facebook