BEYOND - Mobile app for family with time differences

What was delivered?


This is a tiny personal mobile app design project for family members live in different time zones. I did everything from idea to design within 1 week!
Beyond expectation, the design triggered my interest in the difference in Android and iOS design “conventions”. I designed something “hybrid like”, and conducted some casual investigations leading to interesting findings. 


Problem - What's in need?


As an international student, this is my first semester studying aboard from China. Before I came, my boyfriend was here at Atlanta for two years - super long distance relationship. Therefore, I always know that even solid relationship will still rely on fragile communication. 

Complexity appears when we are asking for more, and have more concerns

  • Why he/she didn’t reply my message?
  • Is this a good time for a video call?
  • Is he/she busy now?
  • How to create and keep our shared memories?
  • Could we benefit, instead of being hurt, from the time difference?
  • ......

I have so many problems. So do my parents, my friends, and a lot of others. We love Facebook, but it’s not a perfect solution for families and lovers. Here are some findings through my own experience and interviews: 

research findings

Solution - How to build a clean, private, and strong communication?

Functionality specification: What should be included?

I designed a family message/memory tool called “Beyond (time and location)”, which is a mobile app that works to enhance smooth communication among family members. Key functionalities are:


Low-fi prototype: Build the function, organize the structure, link the logic
Information architecture | Prototyping | Wireframing

I didn’t go too far away from the conventional social app design, at this stage. I designed a typical iOS-like wireframe for Beyond with the major functions in the tab bar. Comparing to hamburger menu, I prefer to use tab bar which I think it’s easier to navigate. This horizontal prototype is designed and implemented in Mockingbot, a handy tool to build low-fi prototypes.

It is worth noting how I designed the safety monitor function. I combined it together with the group section in the home page, instead of making a separated page. I regard the monitor function as a different “mode” of using the app that should be easily reached.


High-fi prototype...and some thoughts
High-fi prototyping | UI kit | Sketch | Hype 3 | Illustrator

I used Sketch for my high-fi prototype design, and used elements from the fabulous UI kit of DO. Then something comes to me: there are some conventions in iOS app design, and some different ones in Android, especially material design - all in the must-read design guidelines. It definitely matters when it comes to the overall harmony of the phone experience, and the developing process.

But, does it really matters to users?

I designed something hybrid - with floating action button, and tab bars. The screen becomes a little crowded, and I could not always put everything in the low-fi screen into this high-fi version. I finally figure it out and implemented the design with Hype, which is the first time I used this fantastic tool to build mobile prototype.

I designed an introduction page with my prototype - in a way to treat it like a new product:


Interviews about the "hybrid design" - to be continued...

To this stage, I am increasingly curious about the hybrid design and how users will think about it. I loaded the prototype on my laptop to avoid bias derived from the phone type, then conducted some casual testing and interviews.
Interestingly, I got some opposite views in different communities. For my fellow HCI students or UX professionals, they would point out their confusion immediately, especially for people who are working in industry now. For the majority of other types of common users, on the other hand, they would not even realize this design has something to do with the “design convention”. Among the 12 people I interviewed, only 1 asked me if this is an Android app or an iOS one as it “looks like something in between because you are using the Google style button”.

So does it really matters to the users? I’m still exploring more on this topic, and wish to share more findings with you later - stay tuned!