To Tab A Bar Or Not To Tab A Bar – on iOS

swapit-blog_appleAs you might have guessed from our last blog post and the one before, we are already working on the iOS app of Swapit. Unlike many of our competitors, we decided not to use any of the cross-platform development tools out there, but to go real native and build the app for each platform from scratch. We believe, this is by far the best way to provide the stellar user experience everyone expects from Swapit – may it be on Android or iOS.

This approach does come with challenges, but also with opportunities. One of the great freedoms we have, when going native on each platform, is to create a custom user interface design that fits perfectly to the target platform. On Android for example, we did a deep dive into the Material Design Guidelines published by Google to ensure all Android users feel right at home when they’re opening the app.

For example, on Android we implemented the standard left side slide out navigation drawer as well as the “+” floating button to create new posts. Those concepts feel very natural to Android users and they feel right at home when they’re using Swapit.

Now, we did some tests by handing our Swapit Android app to some iPhone users. They immediately felt lost, didn’t know what to do and started clicking randomly around the screen, trying to find something useful to do. Especially the floating button at the bottom right corner was something rather unusual for them. So to us it was obvious that we need to cater much more to the standard user behavior of iPhone users in our iOS app.

Last Friday, we finished our very first internal beta of the Swapit iOS app. It can only list items nearby the user’s location and show details of each item. There is not much interaction possible in the app yet. So we started a very small internal beta test of about 10 friends and family folks who have iPhones. Just to see if the app starts up properly on different iPhone models, OS versions, network carriers, locations, indoors/outdoors. Conclusion thus far: it’s lookin’ good!

(Note: Everyone who signed up for our Swapit iOS Beta will get an email when the next version is ready. Stay tuned!)

The Tab Bar Discussion

Two days ago, we had a very heated discussion about the general structure of Swapit on iOS. I’d like to share some details because I feel it might give everyone some insight in our thought and decision making process.

The main question was: should we use a tab bar at the bottom of our standard list screen or should we not use it, but rather bring over the left side navigation pane, which we use in Swapit on Android. Such a tab bar is very common in many standard iOS apps. Just go and check the App Store, iTunes, Safari, Notes, etc. They all have a tab bar. Usually that’s being used to switch between tabs, but sometimes there are also some “actions” in there, which are not particularly switching tabs, but perform a certain action. For example: the Notes app has a “New Folder” action in that bar.

We a camp of people that was for a tab bar and one against it. I personally was against the tab bar, mainly because I feel having a tab bar constantly there, wastes screen real estate, which I’d prefer to use for displaying content. Think, cinematic feel of an app.

However, this is not about what I feel makes sense – in the end, I am not actually a real world iPhone user. Yet, given our experience and the feedback we collected from iPhone users trying to use our Android app, it was clear that we need to cater directly to those iPhone users – no matter what.

On top of that very simple discussion came contextual discussions about the general workflow and where, from a contextual point of view, it will make sense to put certain modules of content in Swapit. Let me give you a quick overview of the top level user interface elements that are accessible right from the main screen in the Swapit Android today:

  1. My User Profile (left navigation drawer)
  2. Swapits Nearby (left navigation drawer)
  3. Inbox (left navigation drawer)
  4. Settings (left navigation drawer)
  5. Invite Friends (left navigation drawer)
  6. Write a Review (left navigation drawer)
  7. Stats (left navigation drawer)
  8. Website (left navigation drawer)
  9. Blog (left navigation drawer)
  10. About (left navigation drawer)
  11. Map (top toolbar, right)
  12. Search (top toolbar, right)
  13. Filters (top toolbar, right)
  14. Post Item (bottom right floating button)

Obviously, it would not be possible to move all such elements into a tab bar on iOS. Adding a left navigation drawer like on Android might be a solution, but it is not standard iOS design — even though some popular apps on iOS have that. To make Swapit’s feel for iOS users as native as possible, we decided to integrate a tab bar at the bottom. It still bugs me personally that we are wasting that screen real estate for this, but if it results in a higher user engagement in the end, then it was the right move.

Now the next question was about what to put into that tab bar and how to order it. Contextually seen, the tab bar’s purpose is to allow the user to switch between tabs. Usually, those are content-related tabs. For example, on the Apple App Store you can switch between Featured Apps, Top Charts of Apps, Categories of Apps, Search of Apps, Updates of Apps. It’s obvious, those tabs switch between viewing apps in a different way or it just orders apps differently.

For Swapit, we want to make sure our users have quick access to the content of the app. Thus, we put all important content-related tabs in the first 4 elements of the tab bar:

  1. Swapits Nearby (left)
  2. My User Profile (center-left)
  3. Sell/Post Item (center)
  4. Search (center-right)

This is how a quick sketch of that looks like:

IMG_20160314_1322531_cropped

Assuming the majority of our users are right-handed, we needed to make sure that the tabs we want the users to use most, are reachable with their thumb when holding the phone in their right hand. One very important goal of Swapit is to encourage people to post their items quickly — in under 30 seconds. That includes finding that “Sell/Post Item” action right away. Therefore, we put that in the center of the tab bar. In this case “Sell/Post Item” is actually a bit of a deviation from the content-related purpose of switching tabs. However, it is essential to have this action right here in the middle to make it as obvious as possible to users on how to post items.

The three other directly accessible tabs here, are essential tab-switches between different ways of viewing items on Swapit. The standard tab that will open when the app starts is the most left “Nearby” tab. You can easily open up your own profile, which also lists your own items. The search field is within a 1-click reach as well. Additional content-related tab switches as well as other functions (About, Website, Blog, etc.) are then accessible through the “More” tab at the bottom right corner.

2016-03-15_android_filtersNow we needed to cover two other important functions:

  1. Inbox
  2. Filters

Filters. We offer very sophisticated filters in Swapit, so you can easily find what you are looking for. As you can see from the Android screen shot (on the right), that’s a rather complex and busy panel, which we might be able to improve/simplify a bit, but in the end it will always have a lot of options. Therefore, we need to reserve a whole panel for our filters on iOS as well. So similarly to Android, the filters panel will be accessible through the top right corner of the top toolbar.

Inbox. The Inbox on the other hand is – from a contextual point of view – very different to most other screens on Swapit. It’s a communication center which combines all notifications you receive through Swapit. May it be comments to items, new item notifications, interested buyers or most importantly chat messages. Furthermore, it is important to know, that the main entry point of users to the inbox is not expected to be through the Swapit app itself. Generally, people enter the inbox through a notification they receive in their Notification Center. So from a navigational point of view, it is absolutely fine to put the inbox at top left corner, like shown in the sketch above. If you would be accessing it a lot from within Swapit’s navigation, it might be cumbersome to reach the Inbox, but in our case that should not happen too often.

Conclusion

After a two hours of a discussion involving pretty much everyone, we settled for the above main structure of Swapit on Android. It is very important to create a clear path for this early on. You don’t want to waste time designing something that people won’t use. Personally, I still prefer Android’s Material Design more because it offers us more screen real estate. Our discussion got heated, emotional and brought out everyone’s passion for Swapit’s success. Yet, in the end we found a solution, that I believe works best for iOS users.

Are you an iOS user? What do you think? Does our reasoning make sense to you?

 

Do you have an Android phone and want to try Swapit? Download it from: http://get.swapit.la

Do you have an iPhone and want to test our Swapit beta? Join the Swapit iOS beta here: Get Yourself on the List Today!

 

Advertisements

Welcome Vito Lee to the Swapit Team

IMG_3580You’ve probably already met the Swapit Team before. We are a small bunch of enthusiastic mobile app guys who want to revolutionize the way people deal with pre-loved items.

Pretty much a month ago, we have brought on Vito to our Swapit Team. He has 1.5 years experience in building mobile apps in different fields like remote controlling smart home appliances or connecting to different kinds of hardware devices from a mobile app (iOS/Android) using Bluetooth.

The recruiting process was pretty straight forward for us. We did actually have 4 candidates who were shortlisted and we chose to go for Vito in the end. We all felt he was the best fit for us in terms of skill set and character fit.

So here it is again: Welcome to our team Vito!

Why did we hire now?

As you might know, we raised some funding in December and again in February. About a year ago when I started to lay out a plan for Swapit in terms of product development and business development, it was clear that we will require funding to grow at the pace we need to. During that time, I came across this term:

“Alignment of Capital to Milestones”

For us to be able to raise funding, we needed a clear path forward – a clear set of milestones we align with the capital we want to raise. One major part of our business is to capture as much market share as possible. In the end Swapit is a trading platform and it will only be as successful as many users we have, and as much as we engage those users. While we feel very passionate about our high engagement rates, we do know that we require a large pool of active users for our marketplace to self-sustain. Read my piece on marketplace liquidity if you want to know more about that. At the same time, we had Swapit only available for Android devices. While we consciously choose to support only Android at the start, we always knew we had to push Swapit out to iPhones and iPads too.

So the funding we raised is aligned to two very important milestones:

  1. Bring Swapit to iPhone and iPad
  2. Increase Market Share to (still secret number) of Users

In order to achieve the first goal, we needed to hire a skilled developer to help us get to that point. We feel very comfortable with our choice thus far and we absolutely certain, we will launch a new Swapit beta on the App Store soon.

 

Stay tuned for our upcoming Swapit on iOS! Get yourself on the Swapit iOS beta list if you’re interested.

Want to try Swapit today? Download it for your Android device from: http://get.swapit.la

Getting Ready for Swapit iOS BETA – Get Yourself on the List Today!

swapit-blog_appleIt is kind of like an open secret, but we are working on the iPhone / iPad app of Swapit. Of course, we are building a native app to ensure a superior user experience. Some of our competitors put out a “web app”, with which I mean it’s an HTML5-based app that looks like a native iOS app. We just believe a real quality app needs to have a very native feel. It must be snappy, it must be beautiful and it must be very resource efficient. All such things are rather hard to achieve with a “web app”, but to us quality is paramount and therefore, we’re going the long way.

swapit-blog_testflightAs soon as our Swapit iOS app is ready to be tested, we will launch a private beta test through Apple’s TestFlight Beta Testing. It’s a great way and actually the official way to get a beta to your iPhone or iPad. To be on the list for our iOS beta test, please enter your information at the following form:

Request Access to SWAPIT iOS BETA:

swapit-blog_requesthttp://goo.gl/forms/jmla9ITbCP

Seats are limited (by Apple, btw). So be quick to join.

Your privacy is important to us!
We only ask for your name and email address. That’s required by Apple TestFlight so we can send you a join email once our iOS beta test is ready for you to join.

 

Choosing a platform for Swapit

Right after we had the idea behind swapit, we had to decide which platform we go for. Such a decision can not be made in a jiffy because it has rather deep ranging consequences.

Hong Kong is 238% Mobile

swapit-blog_238-mobileIn order to choose the right app and right platform we need to back up a bit. In my earlier post about the idea behind swapit I mentioned that there are quite some Facebook groups out there, in which trading similar to what we do in swapit, is being practiced. As such trades happen in real life, swapit is being created as a very localized application. Hong Kong being our ground zero for swapit, we have to look at the mobile landscape to ensure we choose the right platform. With mobile phone penetration of 238.4% as of October 2014 (source ofca.gov.hk) and a population of 7.2 million as of mid-2014 (source censtatd.gov.hk) the market of consumers carrying smartphones is large enough for us to start out.

Android is King

swapit-blog_android-3For better or worse, many markets all over the world look rather similar: #1 mobile operating system is Android, #2 is Apple, #3 is Windows Phone and #4 is BlackBerry. While we at S4BB Limited have a 10+ year experience in developing for BlackBerry, we also have quite some experience in iOS, but more so in Android. Take a look at our great Battery Watch app for example. We could have created swapit for BlackBerry 10 and I am pretty sure app development would have been cut to half the time we require for Android app development, but there are just not enough consumers who use BlackBerry 10 devices out there. So the choice in the end was rather easy: go for Android as an operating system first. Most likely iOS will follow after that and other platforms will be considered too, at a later stage.

Backend for the Wicked

swapit-blog_app-engineHaving the operating system locked down to Android for the first version of the mobile app, we now had to look at how to build our backend. We obviously need to some pretty basic information like: user account data, item sales information (images, description, price, location), and so on. It’s a pretty straight forward set of data broken down to a bunch of strings, digits, geolocations and raw bits & bytes. It’s not rocket science, but it is important to choose the right backend system to ensure scalability, flexibilityease of use for development and most importantly cost-efficiency.

Using Android on the mobile app (=client) side, the most obvious choice was to look at the Google Cloud Platform. We really liked what we saw from a pricing perspective and what really surprised us was the (more-or-less) seamless integration into the new Android Studio. Google’s now de-facto standard IDE for Android development.

To sum it up: we went for Android as mobile app platform and the Google Cloud Platform to run the backend side of things. If you have any tips, tricks or things to warn us about our choices, please feel free to leave a comment here.

Read more about swapit on swapitblogit.wordpress.com.