{"id":5004,"date":"2015-03-02T05:26:56","date_gmt":"2015-03-02T05:26:56","guid":{"rendered":"https:\/\/www.instamojo.com\/blog\/?p=5004"},"modified":"2020-11-18T02:47:58","modified_gmt":"2020-11-17T21:17:58","slug":"designed-instamojo-com-mobile-platform","status":"publish","type":"post","link":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/","title":{"rendered":"How We Designed Instamojo.com for the Mobile Platform"},"content":{"rendered":"<p>At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry. This is adhered to irrespective of the device &#8211; smartphone, tablet or a PC.<\/p>\n<p>Links are promoted by users on various social media which have a strong mobile presence. As is the trend, a growing number of users are making payments via mobile devices using 2G\/3G connections. This presents a unique set of challenges. Here are some factors that we had to consider while designing the experience.<\/p>\n<h2>1. Responsive Design<\/h2>\n<p>The entire Instamojo app is responsive in nature. This is more so for the payment pages. We try to have the right amount of content there displayed to the buyer, with no extra markup.<\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-668\" src=\"https:\/\/blog.instamojo.com\/wp-content\/uploads\/2015\/03\/IMG_6567-1-577x1024.png\" alt=\"IMG_6567 (1)\" width=\"333\" height=\"591\" \/><\/p>\n<p>The payment form adjusts to the smallest of screen sizes and leaves ample room for aesthetically keying in payment details using the relevant keypad.<\/p>\n<p><!--more--><\/p>\n<h2>2. Page Load Speed<\/h2>\n<p>The page load time has to be low as the connection can be flaky.\u00a0We minify and compress our static resources and serve them via CloudFront CDN to reduce the Round Trip Time and download overheads over slower connections.<\/p>\n<p>This means customers in India get to download files from India\u00a0while a customer in the US gets to download files from the US. We are also in the process of creating static resources specifically for payment pages so that there\u2019s no extra byte to be downloaded except for what\u2019s really needed.<\/p>\n<h2>3. Keypad Switch<\/h2>\n<p>We use HTML5 input types to trigger relevant keypads. For instance, when you are typing out the email id, you would see your mobile&#8217;s native keypad which would have the `@` symbol and some would also have a `.com` as well to aid you to quickly type out the email id. Similarly we switch to a numeric keypad for typing out the Credit\/ Debit Card Details.<\/p>\n<p><a href=\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2015\/03\/IMG_6568.png\"><img loading=\"lazy\" class=\"aligncenter size-full wp-image-5176\" src=\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2015\/03\/IMG_6568.png\" alt=\"\" width=\"640\" height=\"1136\" srcset=\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2015\/03\/IMG_6568.png 640w, https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2015\/03\/IMG_6568-169x300.png 169w, https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2015\/03\/IMG_6568-577x1024.png 577w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/a><\/p>\n<p>We are consistently pushing the boundaries towards making our site faster and trying to outperform ourselves every single day at work.<\/p>\n<p>If challenges like this excite you, then we should have a chat. Write in to us with your thoughts.<\/p>\n<p style=\"text-align: center;\"><a class=\"mb-button mb-style-flat mb-size-default mb-corners-default mb-text-style-default \" style=\"background-color: #2bc470;\" href=\"https:\/\/www.instamojo.com\/?ref=blog\">DISCOVER INSTAMOJO<\/a><\/p>\n<p><em><strong>This post was penned by Aakash Goel, Lead UI Engineer at Instamojo.com and Founder of Cheapass.in.<\/strong><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the&hellip;\n","protected":false},"author":6,"featured_media":5006,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[6],"tags":[510,511,512,508,509],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v17.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How We Designed Instamojo.com for the Mobile Platform - Blog Instamojo<\/title>\n<meta name=\"description\" content=\"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How We Designed Instamojo.com for the Mobile Platform - Blog Instamojo\" \/>\n<meta property=\"og:description\" content=\"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog Instamojo\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Instamojo\" \/>\n<meta property=\"article:author\" content=\"facebook.com\/instamojo\" \/>\n<meta property=\"article:published_time\" content=\"2015-03-02T05:26:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-11-17T21:17:58+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"900\" \/>\n\t<meta property=\"og:image:height\" content=\"532\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:creator\" content=\"@instamojo\" \/>\n<meta name=\"twitter:site\" content=\"@instamojo\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Instamojo\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/#organization\",\"name\":\"Instamojo\",\"url\":\"https:\/\/www.instamojo.com\/blog\/\",\"sameAs\":[\"https:\/\/www.facebook.com\/Instamojo\",\"https:\/\/www.instagram.com\/instamojo_india\/\",\"https:\/\/www.linkedin.com\/company\/instamojo\/\",\"https:\/\/www.youtube.com\/user\/instamojo\",\"https:\/\/in.pinterest.com\/instamojo\/\",\"https:\/\/twitter.com\/instamojo\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/#logo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2020\/10\/Instamojo-logo.png\",\"contentUrl\":\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2020\/10\/Instamojo-logo.png\",\"width\":400,\"height\":92,\"caption\":\"Instamojo\"},\"image\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/#website\",\"url\":\"https:\/\/www.instamojo.com\/blog\/\",\"name\":\"Blog Instamojo\",\"description\":\"eCommerce business growth blog\",\"publisher\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.instamojo.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg\",\"contentUrl\":\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg\",\"width\":900,\"height\":532,\"caption\":\"Instamojo Design\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#webpage\",\"url\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/\",\"name\":\"How We Designed Instamojo.com for the Mobile Platform - Blog Instamojo\",\"isPartOf\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#primaryimage\"},\"datePublished\":\"2015-03-02T05:26:56+00:00\",\"dateModified\":\"2020-11-17T21:17:58+00:00\",\"description\":\"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.instamojo.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How We Designed Instamojo.com for the Mobile Platform\"}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#webpage\"},\"author\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/#\/schema\/person\/42d2fa4635c87aa3a0e3665835f155a0\"},\"headline\":\"How We Designed Instamojo.com for the Mobile Platform\",\"datePublished\":\"2015-03-02T05:26:56+00:00\",\"dateModified\":\"2020-11-17T21:17:58+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#webpage\"},\"wordCount\":385,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg\",\"keywords\":[\"Instamojo browser app\",\"Instamojo design\",\"Instamojo engineering\",\"Instamojo for Chrome\",\"Instamojo mobile\"],\"articleSection\":[\"Team Speaks\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/#\/schema\/person\/42d2fa4635c87aa3a0e3665835f155a0\",\"name\":\"Instamojo\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.instamojo.com\/blog\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/1ca6da28cc8b22fb742c790c96543ab9?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/1ca6da28cc8b22fb742c790c96543ab9?s=96&r=g\",\"caption\":\"Instamojo\"},\"description\":\"India's simplest D2C tech platform. Host your online store, create landing pages, or share payment links. Sign up for free.\",\"sameAs\":[\"http:\/\/instamojo.com\",\"facebook.com\/instamojo\",\"https:\/\/twitter.com\/instamojo\"],\"url\":\"https:\/\/www.instamojo.com\/blog\/author\/instamojo\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How We Designed Instamojo.com for the Mobile Platform - Blog Instamojo","description":"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/","og_locale":"en_US","og_type":"article","og_title":"How We Designed Instamojo.com for the Mobile Platform - Blog Instamojo","og_description":"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry.","og_url":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/","og_site_name":"Blog Instamojo","article_publisher":"https:\/\/www.facebook.com\/Instamojo","article_author":"facebook.com\/instamojo","article_published_time":"2015-03-02T05:26:56+00:00","article_modified_time":"2020-11-17T21:17:58+00:00","og_image":[{"width":900,"height":532,"url":"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg","type":"image\/jpeg"}],"twitter_card":"summary","twitter_creator":"@instamojo","twitter_site":"@instamojo","twitter_misc":{"Written by":"Instamojo","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Organization","@id":"https:\/\/www.instamojo.com\/blog\/#organization","name":"Instamojo","url":"https:\/\/www.instamojo.com\/blog\/","sameAs":["https:\/\/www.facebook.com\/Instamojo","https:\/\/www.instagram.com\/instamojo_india\/","https:\/\/www.linkedin.com\/company\/instamojo\/","https:\/\/www.youtube.com\/user\/instamojo","https:\/\/in.pinterest.com\/instamojo\/","https:\/\/twitter.com\/instamojo"],"logo":{"@type":"ImageObject","@id":"https:\/\/www.instamojo.com\/blog\/#logo","inLanguage":"en-US","url":"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2020\/10\/Instamojo-logo.png","contentUrl":"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2020\/10\/Instamojo-logo.png","width":400,"height":92,"caption":"Instamojo"},"image":{"@id":"https:\/\/www.instamojo.com\/blog\/#logo"}},{"@type":"WebSite","@id":"https:\/\/www.instamojo.com\/blog\/#website","url":"https:\/\/www.instamojo.com\/blog\/","name":"Blog Instamojo","description":"eCommerce business growth blog","publisher":{"@id":"https:\/\/www.instamojo.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.instamojo.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#primaryimage","inLanguage":"en-US","url":"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg","contentUrl":"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg","width":900,"height":532,"caption":"Instamojo Design"},{"@type":"WebPage","@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#webpage","url":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/","name":"How We Designed Instamojo.com for the Mobile Platform - Blog Instamojo","isPartOf":{"@id":"https:\/\/www.instamojo.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#primaryimage"},"datePublished":"2015-03-02T05:26:56+00:00","dateModified":"2020-11-17T21:17:58+00:00","description":"At Instamojo.com, we take great pride in design and user experience. This helps us give our users the best conversion rates in the industry.","breadcrumb":{"@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.instamojo.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How We Designed Instamojo.com for the Mobile Platform"}]},{"@type":"Article","@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#article","isPartOf":{"@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#webpage"},"author":{"@id":"https:\/\/www.instamojo.com\/blog\/#\/schema\/person\/42d2fa4635c87aa3a0e3665835f155a0"},"headline":"How We Designed Instamojo.com for the Mobile Platform","datePublished":"2015-03-02T05:26:56+00:00","dateModified":"2020-11-17T21:17:58+00:00","mainEntityOfPage":{"@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#webpage"},"wordCount":385,"commentCount":0,"publisher":{"@id":"https:\/\/www.instamojo.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#primaryimage"},"thumbnailUrl":"https:\/\/www.instamojo.com\/blog\/wp-content\/uploads\/2017\/01\/build-customer-base.jpg","keywords":["Instamojo browser app","Instamojo design","Instamojo engineering","Instamojo for Chrome","Instamojo mobile"],"articleSection":["Team Speaks"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.instamojo.com\/blog\/designed-instamojo-com-mobile-platform\/#respond"]}]},{"@type":"Person","@id":"https:\/\/www.instamojo.com\/blog\/#\/schema\/person\/42d2fa4635c87aa3a0e3665835f155a0","name":"Instamojo","image":{"@type":"ImageObject","@id":"https:\/\/www.instamojo.com\/blog\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/1ca6da28cc8b22fb742c790c96543ab9?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/1ca6da28cc8b22fb742c790c96543ab9?s=96&r=g","caption":"Instamojo"},"description":"India's simplest D2C tech platform. Host your online store, create landing pages, or share payment links. Sign up for free.","sameAs":["http:\/\/instamojo.com","facebook.com\/instamojo","https:\/\/twitter.com\/instamojo"],"url":"https:\/\/www.instamojo.com\/blog\/author\/instamojo\/"}]}},"_links":{"self":[{"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/posts\/5004"}],"collection":[{"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/comments?post=5004"}],"version-history":[{"count":3,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/posts\/5004\/revisions"}],"predecessor-version":[{"id":15583,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/posts\/5004\/revisions\/15583"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/media\/5006"}],"wp:attachment":[{"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/media?parent=5004"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/categories?post=5004"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.instamojo.com\/blog\/wp-json\/wp\/v2\/tags?post=5004"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}