Displaying Hierarchical Information in a Mobile App

Question

trying to come up with a good way of presenting a hierarchy of information on a mobile device. Specifically, I wrote this Khan Academy app for Windows Phone:
http://www.windowsphone.com/en-US/apps/68860880-3df0-df11-9264-00237de2db9e

And previously was using the first iteration of their API, which presented a simple two level structure of playlists and videos. But they are moving to organize their content in a tree using the following API:
http://www.khanacademy.org/api/v1/topictree

Of course, the obvious choice is to let the user drill down and show them one list at a time. So start with the second level, just below the root node. And when they pick a node, either show them the content (if it's a video or url), or navigate to the next level of children and show them that list. But that seems like it may be kind of boring to be honest.

The other, slightly more radical idea I had, was to do something along the lines of what they do on the website for their constellation of knowledge. But I get the sense that this would be filled with yet more usability issues.

Anyways, your thoughts would be appreciated. Would love it if you could point me to examples of mobile apps that present a tree-like structure of information :-)

Answer 1

Category-based organization has been a staple long enough that major departure from category drill-downs is probably a bad idea. That being said, there's plenty of room to innovate. One of my favorite examples is Clear, which drove 350k downloads in 9 days on the app store. Check out the categorization drill down in this video: http://vimeo.com/35693267

I think the ideal model is a combination of search, browse (via categorization) and filtering. For example, the user can search and immediately get a list of content. However, these results will be limited by their search skills (and your search implementation or content quality). So, browse is a good backup but should also allow them to drill down, or immediately jump to results. At that point, you also offer filtering and search-within. Regardless of what you do, actual results should always be a click away.

This is hard to explain and I don't have a visual reference avialable but here's a text example of navigation

All Topics

• Math -user clicks-
• Science
• Etc...

next level >>>

Math

• View Videos -user clicks-
• Algebra
• Geometry
• Etc

Now they see video but they have filtering options >>>

Math Videos

• Sort By:
  • Most Popular
  • Most Recent
• Filter By:
  • Geometry
  • Algebra
  • Etc
• Search Within

Answer 2

When it comes to navigation I would suggest keeping it familiar and simple. If you want to spice up your app a bit, I suggest spending more time on presenting the data in the lists in an interesting way (e.g. instead of just text include thumbnails, etc).