From MozillaWiki
Jump to: navigation, search

Web Apps

Apps quickly become a significant way for people to interact with the Web on mobiles and tablets. How might we bring apps to the browser and the Open Web to create a joyful ecosystem? Read about Mozilla's definition of an app @

What problems or issues did we address?

The fundamental problem we identified with mobile applications, especially current social mobile applications - which happen to be the one of the most frequently used - is that they primarily focus on facilitating communication between people in different geographical locations. This disregards the benefits of connecting with people in ones locality and that is the problem we would like to solve.

Briefly describe the essence of your project & solution

Our project is about promoting physical interpersonal communication, locally through social networking. Through the design of our social application, we plan on inciting people to join their friends and the people and businesses they are connected to through the provision of information on proximity. Through this we will be able to achieve our primary aim of using the social networking mechanic as a means of fostering an increase in interpersonal communications, face-to-face communications and increased group activity.

Team-App (Members)

  • Diana Dayaka Osei[1]
  • Donald Adu-Poku[2]
  • Kwaku Asante Frimpong[3]
  • Nii Sowah Kakai[4]

Background Research

People use apps on mobile devices and tablets mainly to access information or to complete a task on-the-go. Mobile apps can be categorized under finance, entertainment and location-based services. What is great about the web to apps is that the user is immersed in the interaction and the user experience is enjoyable because the feedback the app offers is real-time and relevant. For example, Ovi Map is an app designed to help Nokia phone users find their route and destination accurately.

What Apps do people frequently use?

The mobile application usage statistics are split between social media consumption and entertainment. Majority of people with app-capable mobile phones mostly have social networking apps installed and frequently use this portal to connect with friends, receive up-to-date news, as well as indulge in casual gaming either single-handedly or with a bunch of friends on a social networking platform. The current top five mobile apps in the US are Facebook, iTunes, Google Maps, Weather Channel and Pandora (Who’s the modern media consumer?)

What are the existing gaps in functionality of social networking mobile apps?

Although the stats show that social media usage on a mobile device has increased over the years, there exist some gaps in the functionality of social networking mobile apps. From observation, we find that the existing array of social networking applications focus primarily on connecting people in the generic sense, implying that the user target is large. This focus on a wider scope of people relegates the importance of connecting with locals; namely, the people, the businesses and the services established in our cities and localities. However, if social networking mobile applications are designed to narrow down their target scope, then information can be shared locally, more conveniently and more efficiently.

The design problem

The problem we have identified with apps is based on the results of our research. First, we realized that mobile apps developed globally do not offer enough relevant content and interactivity for local (i.e. Ghanaian) users. Next, we found that some Ghanaians are not active on social networking sites because

  • They have not heard about it and
  • They do not have “friends” there to chat with.

Our aim is to develop a product that merges the benefits of social media with location-based services based on users’ localities so that they can have meaningful interactions with others in the course of the day.

Understanding needs and establishing requirements

In our data gathering exercise, we interacted with real users and assessed their knowledge and use of mobile apps. We also asked them questions to know their values and interests. Our plan for identifying our users’ needs was to conduct one-on-one interviews based on the following excerpt questions;

  1. Apart from making and receiving calls, what do you use your phone for?
  2. Are you able to browse on your phone? If yes, what websites do you visit most frequently?
  3. What kind of mobile apps do you use on your phone?
  4. Tell me about yourself and describe a typical day in your life.
  5. How do mobile apps support your daily activities?
  6. What language do you prefer to instruct your phone in?

We wanted to find out what some Ghanaians think about the functionality of apps and how the apps on their mobile phones help them to achieve their daily tasks. Our interviews showed that in the course of their work, users use their mobile phones for secondary tasks like playing music which arguably do not directly affect the outcome of their work. When asked if they would welcome apps that could facilitate their work, they are optimistic. The requirements that came out of our data gathering activity are as follows: - The product should…

  • Be on a hand-held or mobile device (non-functional)
  • Bring about a positive user experience (non-functional)
  • Enable real-time interaction (functional)
  • Provide the user with visual feedback (functional)
  • Be instructed in English (functional)

These requirements are based on user preference as noted during our data gathering.

Personas and Scenarios

The following personas are based on the interaction we had with real users during our individual interview sessions. We present five (5) personas here:


Heather.jpg Heather is a 25 year old college graduate with a daughter. She’s a single parent and just started out her new job at an art gallery. This requires that she gets up early in the morning, prepare for work as well as get breakfast ready for her daughter and then report to work on time. She circumvents some of these hurdles by ordering breakfast from restaurants and bakeries in the neighborhood, however she wishes she didn’t have to engage the personnel so much to find something suitable to serve as breakfast for her daughter.

This wastes time she actually doesn’t have. She has a friend; Molly who works a couple of blocks from the gallery she works is also a couple of blocks from Heather’s house. Molly has a car and sometimes when they run into each other, Molly gives her a lift to work saving her a public transport pass. Heather wishes she run into Molly more often since they all work and stay in the same areas she could join her every morning to work and back. Heather is shy and finds it inappropriate to check up on Molly every morning in order to car pull with her. Heather thinks calling Molly every morning find out whether if she’ll be able to car pull with her is also inappropriate. She sticks to public transportation most of the time.


John.jpg John works for the local post office; he delivers priority mail to corporations and businesses in the city via his bike. In his free time, he likes to meet up with his buddies in the park and have a bike race. He also likes to join his friends at bars and local gigs however he is forgetful mostly because of how pressuring his work is. His friends knowing this about him do not bother to remind him where the meet up for the night is since they’ve been doing that for a while now via phone calls to no avail. They are deterred to remind him because it is relatively expensive to call people. Because of this John’s evenings are filled with random people, he visits get-togethers and pubs his friends don’t attend. They all want John around because of his lively personality and john also wishes he had his friends around most of the time to share his moments with.


Ben.jpg Ben just started a courier service; he’s running the business on a shoe string budget and thus does not have a lot of assets at his disposal. He is currently looking for an inexpensive way to track all of the dispatched couriers from the office and possibly relay information to them if anything about the delivery changes. He thinks calling every courier demanding a location update is costly and ineffective. Without this tracking system he reckons his business will not be as effective and as profitable as he imagined it would be when he started out.


Laura.jpg Laura is a 28-year old young lady who enjoys following up on current affairs via the internet and tuning in to the evening news on her TV at home. She works 8am to 5pm as a receptionist whose daily tasks varies and is not restricted to receiving guests; making, receiving and transferring calls; disseminating information to other departments. She has a PC that is connected to the internet which she uses for her work and for browsing the web for her news items. Laura often loses track of her tasks as she busily goes about her day attending to everyone’s needs and this sometimes creates problems for her. She would like to be constantly reminded of the things on her to-do list so that she can be more effective. The only time she uses her mobile phone is when she urgently needs to pass on information to someone in the office and is unable to reach that person via the landline or the internet, especially when the internet connection is down. She is not very tech-savvy.


Adjeifio.png Adjeifio is a 32-year old Quantity Surveyor/Cost Engineer/Building Engineer. He likes playing football and hanging out with friends. He is a project management student at GIMPA. He needs to direct suppliers to sites under his supervision, stay in touch and direct site foremen on what to do and get updates on site progress. He sometimes likes to work from the house to meet deadlines and complete urgent project tasks. He is not very tech savvy and therefore relies on his brother, a CS undergraduate, to fix problems and challenges he encounters with his laptop or printer at home. Adjeifio has heard about mobile apps but does not know exactly what they are. Course mates at GIMPA tell him how they tweet messages to each other but he does not comment to avoid exposing his ignorance and not to appear ‘stupid’.

The driver of one of his major material supplier company recently narrated to him how he used Google maps on his HTC_Desire phone to find one of the sites (the MTN Ring Road site) he (Adjeifio) was supervising. He immediately begins to wonder if it would be possible for him to join the social network community, particularly twitter, but be able to get location information as well as directions about people he exchanges messages with and some commercial services in the metropolis. However, he needs to pay regular surprise visits to some of the construction sites even if he communicates (tweet) with the foremen (he does not want them to know he is coming). He thus would want to communicate to this effect without his location being known. He always has his ears on the ground to get information on discounts and promotions of companies that sell building materials. Part of his success with his work is as a result of the reduced cost he offers customers for their building projects.

As a cost engineer, he is always looking forward to optimizing profit through minimizing cost. Getting timely information on discounts is therefore core to his business. Adjeifio also administers part time consultancy to Bureg, a Civil and Building Engineering company, where he formerly worked fulltime. He needs to periodically e-mail project deliverables and cost sheets of outsourced tasks to the C.E.O of Bureg. During the last semester, Adjeifio studied e-commerce and read about how web/mobile technology can be used to improve business processes and increase profits. He is willing to adapt to any new technology that will facilitate his work but the challenge is with the ‘what/which technology product to fall on to.’ During his quantity surveying course, he learnt how to use AUTOCAD and ArcGIS mapping and geological survey software. Therefore adapting to the use of Google maps as described by the driver would not be much of a problem. Adjeifio currently uses an old Nokia phone, a 23xx series, and is considering acquiring a Blackberry Storm. He does not like reading through manuals and long help documentations. He has got his eyes out there for the next mobile technology that will answer most his questions and facilitate his work.


Concept Name: Socialize.Me

Main Concept: To merge functionalities of G-MAP & TWITTER to deliver real-time information about the location of friends, services, and businesses. This is called Microblogging or Social bookmarking.

[Watch our video on YouTube]

Concepts used

The concepts Socialize.Me uses are:

  • Geo-locating colleagues, friends, businesses and local services
  • Real-time instant messaging and voice interaction with friends and colleagues
  • Social networking
  • Geographically accurate visual representation of the locations of friends, businesses and colleagues in a city or town.
  • Real time information sharing and searching.
  • Making appointments with friends, pre-ordering from local businesses and leveraging local services

Relationship between Concepts

The accurate visual representations of cities, and the location of friends and colleagues in them facilitate natural filtering of people in close proximity. This allows real time instant messaging and voice interaction between people; mostly this is because someone needs to find some relevant info. Through the medium of real time instant messaging and voice interaction, real time information sharing and searching is enabled. The visual of proximity in terms of businesses, local services and friends also lead to making plans with friends to meet at places or spend parts of the day together, pre-ordering goods from local businesses and patronizing services in the immediate vicinity.


Initial Problem


Our initial idea was to merge the visual and accurate representation of entities of Google maps with the real-time social interaction mechanics of twitter, and localizing it to a city. This essentially became the problem we had to solve with our prototypes.

Prototype 1

Prototype 1.png

  • Interface displays everything on the screen without any hidden interfaces.
  • User interface is fairly simple and complies with some standards (the update widget is like that of twitter).
  • Updates tooltips of users cover parts of the map; they could obscure other users on the map.
  • The area of the map visible is greatly reduced due to the overlaid user interface.

Prototype 2

Prototype 2.png

  • Very suggestive user interface.
  • Shows a greater part of the map on screen with very little overlaid UI.
  • User updates are suggested by the UI. It is not displayed immediately on the screen (saves map view area).
  • User updates are suggested by the UI. It is not displayed immediately on the screen (Updates are not immediately visible).
  • Interface has a lot of hidden UI.

Prototype 3

Prototype 3.png

  • Saves even more map view area with the arrows placed on the top right corner.
  • Very suggestive user interface.
  • Shows a greater part of the map on screen with very little overlaid UI.
  • User updates are suggested by the UI. It is not displayed immediately on the screen (saves map view area).
  • User updates are suggested by the UI. It is not displayed immediately on the screen (Updates are not immediately visible).
  • Interface has a lot of hidden UI.

Phase Outputs

[all outputs that your lecturer expects you to produce and share]

Feedback and Impact

Feedback provided by industry professional Penny Hagen

This project identifies a number of important aspects for exploration in terms of the value of developing knowledge about local mobile usage information (not just using US stats) and the value of proximity, locality and social networks for connecting people. It would interesting to know if in doing the research the team looked at other existing mash ups that combine geolocated tweets and maps, or any of the generic apps that are designed to exploit geolocation and locality e.g. Fixmystreet, FourSquare, Gowalla,, to see how these differ or compare. (n.b I tried to follow the links provided but they don't seem to go anywhere at this stage.)

This is a great research area with lots of potential and the personas and scenarios really help to bring to life some of the issues and the potential for this concept. I would ask though - did the personas feed the product concept, or were the personas written to support a particular product concept that had already been defined? The later helps you explore the concept more fully, but perhaps limits the possibilities of what you might learn or trigger through the use of personas and scenarios. The concepts sketches successfully convey key idea and some potential variations on the interface presentation. It would be great to also see information in the sketches about how this interface responds to "what Ghanaians want". Currently the sketches explore emphasis on the presentation of status updates onto a map, the research and the personas and scenarios identified a number of local applications for this interface and it would be interesting to see those explored in the concepting stage through scenarios, or wireframes or story boards that relate back to how the product will actually be used and experienced. It might also be interesting to consider other ways in which people could navigate this information, (e.g., lists of friends that were close by) other than the map interface.

General feedback for MAPD and Apps (from Penny Hagen)

Interviews are a great way to interact with users and gain an understanding of what people think about different things. One of their limitations is that people can only tell us what they remember or what is top of mind, so they don't necessarily get us to the depth of how people interact with technology (or other things) in their daily life. In addition, as I am sure you've heard before, often what people say they do is different to what they actually do - this is not intentional, its just that we don't constantly observe ourselves or own behaviour - so interviews can be good for getting at explicit information but they rely on people having a good, reflective sense of their own practices but often we have to work a bit to access to things that people themselves aren't aware off.

To help people delve into this kind of detail for example, we can try asking them to describe a recent time when they used their phone, or were frustrated with their phone. Getting people to talk in examples often moves us beyond the obvious. Also, try asking "why" more often - not just "what" i.e why do people use or prefer particular things, people may use things for reason quite different to that which we expect. It can also be useful at times to use a kind of primer before the interview that helps to sensitise the participants to their own behaviours and attitudes. I.e., asking people to record for a day or two what they are doing with their phone, this helps to make things that are implicit more top of mind at the interview. Habits and rituals in particular are hard for people to identify in an interview, but a diary or primer prior can sensitise them more deeply to their own practice, and help them to share them with you.

We also need to be mindful of asking very specific questions in the interviews as these can limit the kinds of information people will share. (Though of course sometimes specific questions are very appropriate). Often its good not to embed assumptions into the questions. For example, rather than immediately exclude the making and of receiving calls, letting people describe in their own words how they use the phone, and what they consider to be most important (and then following up with prompts or more specific questions) might allow some surprising things to come out, as people describe their phone using their own language and in their own way. A technique I have used before is to ask people to give you a "tour" of their phone and the most important features.

Feedback provided by Thomas Arend, Lead Product Manager, Mozilla Mobile

Overall: Great structure and excellent level of detail. Great job!!

Web Apps: very nice intro. Could need some more detail, e.g. how the mobile world is heavily based on native apps, and how we are seeing a shift to web-based apps now, similar to what happened with desktop computers. Native apps require code on the device while web apps use the internet as the platform. Advantages: no need for expensive ports of code to different platforms, always available and accessible, seamless experience on all devices and platforms, sharing and social features

Problems addressed: facilitating communication between people in different locations is a great focus. Can someone get rid of time zones for me, please (kidding). Of course, there are other important aspects that would be worth looking at: e.g. different form factors, embedded systems (what if I could use every bus stop, every table top, every elevator wall to access my web), etc.

Essence of project and solution: very interesting. Could be a bit crisper. What is the executive summary? Are there any concrete results or examples that are worth mentioning here? This summary is good but sounds a bit - academic. Also, what defines "Proximity" in this case? And: how exactly does this relate to "mobile"?

Team-App Members: Nice to e-meet you! Thanks for working on this project, Diana, Donald, Kwaku, and Nii :)

Background Research: Would be good to have more details here. Also: the app world is changing toward web apps. And: apps are changing from single purpose apps to more interactive apps with the latest technology (think: having multiple "windows" open on a large mobile device allows for "drag & drop" like interaction to connect apps, e.g. to share music I am listening to on Pandora with my friends on Facebook and Twitter quickly while chatting with my mom on Video.

The design problem: We have to distinguish between local apps and local content here. The aim should be moved up to the top of the doc to explain what you are up to. A nice example would help here! Also: are those the only challenges? What about access to the web, to modern mobile devices, etc?

Understanding needs: Very nice! I like your questions and the way you documented them. Very nice collection of requirements. Just make sure questions are very specific and follow themes, e.g. user requirements, unmet needs, historical approach (how are they solving the issue today?), alternatives, experiences, workarounds, their own ideas, projections of where they would like to be in an ideal world, etc. I am also curious to see how you categorize your findings. Apart from a questionnaire, have you considered user observation? Building a product based on what users ask for is not always what they really need. That is probably why Henry Ford emphasized that, had he listened to his customers, he would have provided faster horses for carriages instead of cars. Users typically think within the horizon of their use case and of their unmet needs, desires and also technical limitations. They may not know what to ask for :)

Personas and Scenarios: Love it. Nice and visual, a great mix of different user types and use cases. I particularly like the fact that you keep personas and their use cases separate from actual technical implementation, which is really important. Some personas (Adjeifio) are a bit wordy. Try to keep them very crisp and short. Maybe add additional titles like "Ben - The Explorer" or "Laura - Casual User" etc. which may help to characterize your personas even more. Special hint: Use names that remind you of the user types. E.g. if you have a "Power User" - call him "Peter Urban", if you have an Entrepreneur, call her "Erica" etc. - that way, names stick, and you immediately know their role. Also: summarize their top priority needs may help with focus.

Concept: Needs more detail. What does Socialize.Me have to do with (a) mobile, (b) your goal. Also: what are available solutions? Like: doesn't Google Latitude and Buzz do the exact same thing? What are differences? How is your concept different?

Concepts used: Great set. Would be good to also mention your assumptions: participants carry mobile devices with web connection and geo-location capabilities? What else? Can I also use it in a different setup? e.g. from an Internetcafe in Timbuktu? With a shared device? At a web-kiosk in Nepal? Or even over the phone (old school, I know!).

Relationships between Concepts: Sounds great. Can't wait to see a concrete example, maybe using the above personas :)

Prototypes: Awesome work! Love the visualization. May I suggest to add more visuals to the beginning of the document, to show the complexity of the problem. A flow-chart may do the trick. The prototypes are very nicely done. I love the level of detail, while not getting lost in actual design elements. I really like the pros and cons. However: what do those mean for the above mentioned personas? Maybe there need to be different interfaces for different user types? The typical answer is: customization and personalization. I would love to see a summary - after seeing those prototypes - what is your verdict or recommendation

Summary: I am missing a brief summary at the end, which goes back to the project charter, gives a concrete recommendation on the concept and solution (which prototype or combination of prototype features do you suggest). Also: I suggest to close the loop on your personas: with your suggested solution, how would your personas interact with the proposed system? Do you meet all their needs? Are they happy about the features? Do you solve a problem they didn't know they had or offer features that they didn't dare to ask for?

Overall, I have to say that I am really impressed to see such a great, creative, and high-quality result, using a lot of awesome (and very useful) UX methodology. Thanks for putting so much effort into this project. I can't wait to see more!! And I would love to run some concrete mobile design issues by your students to get your help and creative ideas ;o)

Great Job!! Feel free to contact me anytime at if you have any questions or additional comments. Thanks!