lesson learned in developing ui and mobile apps blibli.com
TRANSCRIPT
Lesson learned in developing UI and mobile apps blibli.com
Ifnu, 8 April 2016
What are we going to talk today?
• Lesson learned in developing UI and mobile apps blibli.com
• List of lesson I learn during my time at blibli.com
• Lesson developing UI• Lesson developing mobile apps
Agenda
• Who am I?• What we learn about customer• Then vs Now• Lesson 1 : People• Lesson 2 : Process• Lesson 3 : Solr• Lesson 4 : Cache• Lesson 5 : Microservices• Lesson 6 : Web UI• Lesson 7 : Mobile First • Lesson 8 : Content
Who am I?
• Ifnu Bima• Ilmu Komputer IPB• Join blibli in 2012• Was working for Deustche Bank Singapore since 2010• Employee no 69• Engineers no ~13• Development Manager
– blibli.com Web UI– Mobile Apps : Android, iOS, Windows Phone– Content Management System – Search– Product Discovery : Wishlist, Product Review
What we learn about customer
• Fast UI – Speed & Performance
• Website stay up during promotion and flash sale – Scalability & Elasticity
• Consistently good user experience– Great UI/UX– Timely order delivery – Original and high quality product
• New features– Rapid Deployment– Continuous Delivery
Then vs Now
• Based on 4 things that customer have, how do we improve over time
• Things we learn along the way
Blibli UI circa 2012
Blibli architecture circa 2012
Store Front
Back officeMerchant
Blibli GUI application architecture 2016
Lesson 1 : People
• Hiring is the most important job in growing company– 800+ people– 150+ engineers
• Right person with knowledge, skill and attitude
• Do not compromise on quality• Hire someone better than you, at least when
you are at their age
Lesson 2 : Process => Product development
Product
Program Manager
Development Manager
Product Manager
1. Product Manager (PM)– Defining the right product
2. Development Manager (DM)
– Building the product right3. Program Manager (PgM)
– Cross-functional executioner
Source: Inspired: How To Create Products Customers Love
Lesson 2 : Process => Agile, XP and Scrum
• Scrum role is perfectly fit with product development role
• Release fast• Test Driven Development, 90% code coverage• Refactor often
Lesson 3 : SOLR
• Product catalog and category • Full text search on product
– Very vast full text search compared to database– Relevancy score to sort search result
• Filtering and Faceting• Very fast• Elasticsearch as alternative • CQRS (Command Query Responsibility
Segregation) pattern
Lesson 4 : Cache
• Redis– User session– Very fast for small and lots of data– Turn off disk flush, it can make server disk IO 100% and
response timeout while flusing• Guava
– Cache content from CMS– In memory cache– Background cache reload
• Varnish– Cache HTML in front of app server– Same content for all user, cannot do personalization
Lesson 5 : Microservices
• Small team working on product• Independence release• Cross functional team vs Siloed functional
team• GUI application as orchestrator
Lesson 6 : Web UI
• Responsive vs Adaptive• AngularJS is great• Browsing through mobile web then purchase
through desktop web• Image is our biggest enemy
– 95+% traffic is image– Compress, resize and optimize it reduce 50% bandwith– Image operation need very high CPU
• Client side performance is much much harder than server side performance
Lesson 7 : Mobile First
• Based on our traffic, there are 3 peak each every day: morning, afternoon and night
• Morning and afternoon from desktop, Night from mobile web & apps• Only office worker is using desktop• To reach majority of Indonesia user, we need first class mobile web and
apps• Mobile apps conversion is 7x web conversion• 70% web traffic goes to mobile web• 80% transaction happen on desktop web• We want user to use mobile apps as much as possible
Lesson 7 : Mobile First
• Native is first choice• Others if you constrained by budget or team
size• More engineers currently working in mobile
apps than web
Lesson 8 : Content
• Banner and promotion page• Different content for different channel : web
and mobile apps• Control UI from CMS• Layout and content saved in database, no
deployment while update it
THANK YOU