2.4.2. Overview and Detail
So, if we’re happy with our list structure, we can move on to creating what a detailed
view for a given location will look like. This is an example of the master/detail pattern
we touched on earlier. From the index of locations, our users have selected an area of
interest. Once they click on that location, we can narrow the focus and show them
information from that one spot. Let’s take a stab at that—Figure 7 shows what we’ve come up with.
All the vital bits of information about a spot are present: the name, address, and a
breakdown of the recent celebrity sightings that have occurred there. If there’s a
photograph associated with a sighting, we can include it as a thumbnail (and perhaps link
to a larger version). There’s plenty more we could include here—for example, a breakdown
of the most-sighted celebs at this particular spot, or a perhaps a photo gallery of each
sighting—but we’re trying to keep it simple, right? The set of information we’re showing
here will let our users know who’s been spotted recently—the most important piece of
information we can provide them with.
3. Finding Sightings by Celebrity
We’ve now worked out the location-centric path through our application, but what if
our users are only interested in a particular celebrity? Charlie Sheen showing up at their
local bar every evening is irrelevant if they’re only interested in what Brad Pitt is up
to. Again, a master/detail view is the pattern we are going to use here, as it makes sense
in this situation. An index of names ordered alphabetically is a familiar and
easy-to-grasp interface for most users (mobile or otherwise). Figure 8 shows our wireframe for this screen.
There we are: a dead-easy way for our users to find their celebrity of choice. It’s
worth noting that such a basic interface is potentially problematic; if our app becomes
very popular and there are suddenly 1,000 stars in our database, a list like this becomes
unwieldy.
It’d be fine if we were only interested in the Brad Pitts of the world, but if our
taste changes to, say, Zach Braff, that’s a whole lot of scrolling to do. The Android
contacts application addresses this issue by including an additional scroll tab, allowing
users to jump around the whole list (with lesser accuracy). iOS has an extra alphabetical
scroll area that can be used to skip to the start of a single letter grouping. Both those
platforms also let you narrow the list by searching within it. For our application, we’re
going to start simple, and deal with that problem if and when it becomes an issue for our
users.
That’s our master view. Now on to the detail for a single star, which you can see in
Figure 9.
The detail view for a star is basically the same as for a location, except the roles
are reversed. Again, we have all the bits we need: the name of the star we selected, and a
list of recent sightings with their locations. You can think of these pages as an index
for sightings filtered by the context through which we arrived: one way is through spots,
the other through celebrities.
4. Adding a Sighting
Now that we’ve catered for user movement through our
application, we need a way for users to contribute to our content. The success of our
application is going to depend on the amount of information we can provide people with.
Imagine a café review application that has no cafés—what’s the point of a
celebrity-sighting service if no one can track their sightings?
Encouraging
users to fill out forms online is difficult at the best of times, but it’s exacerbated on
mobile. The longer it takes for users to fill in a form on their mobile device, the higher
the possibility that failures or errors will happen—say, losing network connectivity.
Designing for efficiency is paramount.
We have to make sure we’re including
everything necessary to flesh out a sighting. A sighting is the combination of a star at a
spot on a given date. Those three facts are all we really need.
Figure 10 shows a basic mockup for this form. It strikes a good
balance by collecting all the information we need, while still being simple enough to not
scare users away from using it.
