Build Your Own Instagram App

Building a mobile application can be challenging and time consuming. Breaking it down into smaller components and understanding what’s needed to be successful in developing the product is a great place to begin. As an example we took the Instagram app and deconstructed it at a high level to understand what it would take to ship this product.

Authentication

Instagram allows users to sign in with either a username and password combination or using Facebook Connect to use an existing Facebook account. Both of these authentication methodologies can be employed in building your own application User Interface The screen which first appears when opening the app is the activity feed which shows a list of the most recent pictures from accounts being followed by the user. The app also uses a tab bar interface to allow the user to easily access different features in the app.

Populating the Activity Feed

The activity feed is populated into a table view by loading data from a web server. If the web server application which is being called is written correctly, the app will send a request to get the user’s activity feed and it will respond with the necessary for the app to populate the activity feed. The endpoint being called should support pagination so that the app can specify how many results to receive from the server at a time. The images to be shown in the activity feed are send to the app as URLs where the images can be loaded from and should be “lazy loaded”, meaning that they should only download to the app from the cloud when the user scrolls to it.

A user should theoretically be able to view all images posted by all accounts they are following if they continually scroll down. This is a lot of data for the app to download from the cloud and it will be extremely slow and inefficient to download all of this data at the same time. Pagination allows an app to request a certain number of records from the cloud on a single request. The app will keep track of which records have already been requested and will request the next set of data once the user scrolls far enough down on the activity feed.

An important feature that the instagram app provides is the ability to search for other users and find content from users you may not necessarily know. The ability to seek out new content and connect with other users is part of what makes the instagram app “sticky” and keeps users coming back and is an essential feature for this type of app. All the information displayed here will be retrieved from your backend web application (discussed below).

Backend

A custom backend app which will need deployed and be hosted either on your own server if you have access to your own hardware infrastructure, or on a cloud computing platform. Some examples of cloud computing platforms are Amazon Web Services, Digital Ocean and Google Cloud Platform.

The mobile application will make requests to the web application on this server via RESTful endpoints. An example of a request which can be made is for the app to request the user’s activity feed. The server will respond to the app with all the data needed to populate the activity feed on the mobile device. A list of image objects will be sent back to the mobile device. Each image object will contain at the very least an image url, list of comments and image owner name. The mobile application will be responsible for displaying and formatting the data appropriately.

Building your App

Building a mobile app similar to Instagram with a supporting backend web application along with the managing the server infrastructure can be long and costly. At Tappforce, we’ve been building mobile and web applications for the last decade. We’ve successfully implemented several Instagram-like applications for happy customers.

Contact us for a free quote today

iOS & Android Continuous Delivery

As we enter 2017 the Google Play Store will have over 2.6 million apps and the iTunes App Store following with roughly 2 million. Your customers demand apps that are equipped with cutting edge features and flat out fast. Your competitors like Facebook and Uber are releasing updates almost every week

Mobile products need a continuous delivery (CD) pipeline so your development team can focus on building features, and less time figuring out how to release faster.

Continuous Delivery is not a new concept. CD has been adopted by web applications for a long time. Martin Fowler published his seminal CD post in 2013: http://martinfowler.com/bliki/ContinuousDelivery.html

CD requires your team to stop building source code manually, and relying on complete automation to deliver builds to QA, beta testers and ultimately the App Stores.

Continuous Delivery Challenges on Mobile

Mobile is an entirely different beast when it comes to application deployment. Web apps don’t require approval processes, and you can even roll out new features to small batches of your customers so you can test if a feature is working before your entire user base gets it. This level of experimentation and sophistication is near impossible to achieve on mobile with out-of-the-box functionality in XCode and Android Studio, but is absolutely necessary if you want your business to run completely agile. Remember, customers suffer from app of the week fatigue. You are hot one week only to be replaced by the next best thing a week later. You need to iterate on features, design, user experience and feedback at a rapid pace to keep up with changing consumer behavior.

Mobile apps need to be developed, tested, compiled, packaged, signed and then manually submitted into the App Store which requires you to fill out forms before you go live. If your app’s cycle time from being developed to going live takes longer than 10 minutes, you are not shipping fast enough. Customers simply will not wait for new features to come out. The average user deletes an app from the homescreen after a day if you are not compelling.

Fastlane

Luckily, the open source community has forged a tool called Fastlane that helps you automate many of the deployment & configuration tasks required to truly ship an app in a continuous fashion. Fastlane allows you to grab developer profiles, sign applications, and link with your test suite so you can run an automated test anytime a developer checks in new code. Fastlane requires a dedicated server, setup and configuration, but the investment is well worth increased developer productivity.

Tappforce is able to ship apps for customers at light speed because we’ve already built our fastlane CD pipeline. We’re able to focus on cutting edge features and running A/B tests so we nail the user experience and not worry about deployment.

Fastlane in Your Cloud or Container

Setting up Fastlane, Jenkins, and a dedicated server is a tedious process. If your team is small or just doesn’t have time to invest in continuous delivery right now, we’ve built a fully functioning stack that runs on AWS or Docker so you can start using Fastlane with the push of a button, no manual setup necessary. Sign up for access below:

Messaging Apps are the New UI

Bots, Bots, and More Bots Everywhere

Apple announced iMessage Apps at this year’s WWDC ’16 Keynote. Google showcased Google Bot at I/O. Microsoft, Amazon and Facebook each have their own AI tools and bot platforms for brands to engage with their customers, but what exactly does that mean? Are we going to just chat away with Google Bot in our messaging apps and order pizzas through SMS?

That depends on whose bot platform you interact with. Each one has their own spin on the mobile user experience. Today we’ll dig into mobile bot UX.

Bot Buttons as UI

Apple iMessage Apps

Apple will feature an iMessage Store where customers can discover brand apps

Apple believes that bots won’t be sentient anytime soon. In fact, Apple doesn’t even mention the term bots anywhere in their marketing materials, however are offering developers the ability to develop messaging apps within iMessage itself. This will allow companies to build experiences like ordering a pizza or an Uber without ever having to leave iMessage. Apple believes the interaction between the customer and the iMessage app require both conversation and buttons. Allow me to explain.


You: “I’d like to order a pepperoni pizza please”
Dominos: “Sure, what size?”
You: “lrg”
Dominos: “I didn’t quite understand that”
You: “large!!!!!!”
Dominos: “What additional toppings would you like?”
You: “cheez, jalapenos and extra marnara SAU5”
Dominos: “I didn’t quite understand that”
You: “CHEESE. JALAPENOS. EXTRA MARINA SAUCE (╯°□°)╯︵ ┻━┻ ”
Dominos: “Ok thanks, your bill is $20.10”
You: “k”

If a bot can’t understand mistakes you enter in chat, the entire experience is ruined, and you might as well pick up the phone or use your pizza app like an animal.

Apple wants to fix this problem with UI buttons. Make a chat request, but use buttons to navigate through the decision tree so you don’t get frustrated with spelling mistakes and unrecognizable queries. Matt Galligan, Ex-CEO of Circa shows us how you would order a cab straight from iMessage.

iMessage will allow developers to use their own canvas to show UI like a map and button to ease the transaction

The combination of text and buttons with specific call to actions can be a great way to provide a transactional experience, without ever leaving your chat. This is reminiscent of popular Asian messaging startups like WeChat. Apple definitely studied this behavior and took one for their playbook

The WeChat Store allows brands to setup webview storefronts to display right inside of chat

Facebook Messenger

Facebook Messenger will let you display relevant content and associated buttons to guide you through a transaction

Facebook, like Apple is also a believer in button UI’s within chat. In fact, Facebook was the first of the Big Four to roll this out. There are already hundreds of Messenger apps that let you order cabs, tell you the weather and even order pizza’s through chat and buttons. Messenger Bots have a slight edge for Apple. Facebook can process natural language and reduce the number of chat errors that occur in the conversation. This mix of conversations plus buttons may be the holy grail of mobile e-commerce.

Google Allo

Google Allo comes up with ways for you to respond back to a recipient and lets you choose with a button

Let’s talk about Google. Google might as well have been the first company to successfully develop artificial intelligence at scale, successfully on the web. Google can handle any search you throw at it, and we tell all of our secrets to the holy search box.

Google wants to take this accuracy and let you converse with Google Bot within their Allo messaging app. Allo will learn how to respond to requests for you, and give you relevant information based on where you’ve shopped, what’s on your calendar, and where your’e planning on going by popping up response buttons. Cool stuff, big brother. While Google hasn’t officially rolled out an e-commerce/developer platform to plug into Allo, you can bet they are planning on this, and with the speed and accuracy of Google search, we may one day have a full text conversation with Google Bot and run our errands.

Building Your Own Messaging Apps & Bots

Brands need to engage where their customers are. There is no denying that iOS & Android have won the mobile wars and carry the majority of the distribution required to reach out to your customers. Building a messaging app or bot is a great way to interact and transact with a customer base that is increasingly chatting and snapping at the same time. Tappforce develops engaging chat bots on iOS & Android.