Lesson learned in developing UI and mobile apps blibli.com
Download as PPTX, PDF2 likes742 views
This document outlines lessons learned from developing the UI and mobile apps for blibli.com. It discusses improving the customer experience through fast performance, scalability, and new features. It provides lessons on hiring the right people, implementing agile processes, using technologies like Solr, Redis, and microservices, prioritizing mobile-first and native apps, and managing content. The key takeaways are that hiring, processes, technologies, platforms, and content all need continuous improvement to best serve customers.
Lesson learned in developing UI and mobile apps blibli.com
- 1. Lesson learned in developing UI and mobile apps blibli.com Ifnu, 8 April 2016
- 2. 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
- 3. 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
- 4. 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
- 5. 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
- 6. Then vs Now • Based on 4 things that customer have, how do we improve over time • Things we learn along the way
- 7. Blibli UI circa 2012
- 9. Blibli architecture circa 2012 Store Front Back officeMerchant
- 10. Blibli GUI application architecture 2016
- 11. 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
- 12. 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 right 3. Program Manager (PgM) – Cross-functional executioner Source: Inspired: How To Create Products Customers Love
- 13. 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
- 14. 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
- 15. 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
- 16. Lesson 5 : Microservices • Small team working on product • Independence release • Cross functional team vs Siloed functional team • GUI application as orchestrator
- 17. 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
- 18. 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
- 19. 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
- 20. 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
- 21. THANK YOU