Online Strategy & Development In a nutshell
Big Picture Consumer Device Convergence
Big Picture Web & Media Convergence
Web Characteristics Live: Bloomberg, Wimbeldon Interactive: Mortgage calculator before the web? Permanent: No undo. Archiv...
Analytics What is being clicked ? What pages are being loaded? How much time is being spent on a page? What is the navigat...
Demographic Profiling & Targetting Dawn targets individuals & households. Sunday print has magazine from women, children’s...
IA/UI/UX Search or browse? Returning or new? On-boarding Process? Goal? Time? Clicks? Reduce clicks, roundtrips, scroll Ho...
IA/UI/UX Validation with JS, app or DB? <ul><li>Interaction design: Image gallery </li></ul><ul><li>Keyboard left and righ...
IA/UI/UX Don’t make the user think Assume user has bad memory, is a poor decision maker and extremely slow and lazy. Desig...
Process Ship it! Keep it simple Daily, Weekly, Monthly milestones Build First. Refine Later. Version control, bug tracking...
Web Architecture Stateless. GET, POST, sessions, cookies Centralized. Easy deploy. Quick bug fix turnaround (Gmail has gon...
Web Stack HTTP: GET, POST, PUT, DELETE (HTML4 lacks support) HTTP: 2/4 concurrent browser limit. IE8 6/6. Do ASync. HTTP: ...
Web Stack JavaScript: faster engines ahead (v8/chrome, tracemonkey/FF) JS: Use JSON. Avoid XML, CSV Don’t inline JS: Objec...
Web Stack Build RESTful services and web APIs Frameworks: MVC, ORM (EF, nHibernate), Blueprint/960.gs, jQuery Automate: 1 ...
Strategy: Platform Strategy Everyone uses the platform. Seeks broad adoption. Microsoft Windows ME seeks to be the underly...
Strategy: Ecosystem Strategy Everyone contributes. Everyone benefits. Give to get. Microsoft has an ecosystems strategy. P...
Strategy: Blue Ocean Strategy Nintendo Wii. Didn’t compete. Created new segment. Bing does not want to be a search engine....
Strategy: Disruptive Strategy Element of Surprise. GMail. Apple notorious for secrecy. Competitors find it hard to react (...
Strategy: Embrace & Extend Microsoft’s Strategy Wait for market to validate then E&E. Need resources. Need foresight. Need...
Strategy: Tiny verticals, Long tail Easy to build Easy to manage Can respond quickly. Can iterate quickly. Specialization ...
Strategy: Competitive Strategy Seed it. StackOverflow seeded with industry leaders. Differentiate. Some like it hot, some ...
Reach Out Email [email_address] LinkedIn tinyurl.com/onlinestrategy Personal aleembawany.com Please drop an email to say h...
Upcoming SlideShare
Loading in …5
×

Online Strategy And Development In A Nutshell

1,500 views

Published on

The presentation highlights interaction design, usability, tools and platforms choices, recommended coding practices, architecture, processes, competitive & business strategy and everything that a great web developer should know about.

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,500
On SlideShare
0
From Embeds
0
Number of Embeds
73
Actions
Shares
0
Downloads
36
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Online Strategy And Development In A Nutshell

  1. 1. Online Strategy & Development In a nutshell
  2. 2. Big Picture Consumer Device Convergence
  3. 3. Big Picture Web & Media Convergence
  4. 4. Web Characteristics Live: Bloomberg, Wimbeldon Interactive: Mortgage calculator before the web? Permanent: No undo. Archives. No space constraints. Cumulative. Collaborative: WikiPedia, Open source, Google Maps. Trackbacks. Comments. Forums. Noisy. Information Overload (Twitter) Viral: email, facebook, youtube. On demand: Google Search. URLs. Now Social.
  5. 5. Analytics What is being clicked ? What pages are being loaded? How much time is being spent on a page? What is the navigation path? Who is being read? Real time Ad placement, sales, context.
  6. 6. Demographic Profiling & Targetting Dawn targets individuals & households. Sunday print has magazine from women, children’s section, classifieds etc. iPhone targets the more tech savvy. Older generation finds it complex. Prefers tactile feedback. Localization & internationalization
  7. 7. IA/UI/UX Search or browse? Returning or new? On-boarding Process? Goal? Time? Clicks? Reduce clicks, roundtrips, scroll Hours, minutes or seconds? OnMouseDown or OnMouseClick? Rozee.pk gets it. Jang doesn’t but lacks competition. Graceful degradation Progressive rendering Discoverability. Gmail now has drag/drop.
  8. 8. IA/UI/UX Validation with JS, app or DB? <ul><li>Interaction design: Image gallery </li></ul><ul><li>Keyboard left and right. </li></ul><ul><li>Image width/height attributes set (avoids redrawing, attributes available to JS earlier). </li></ul><ul><li>Prev/Next links but carousel even better. </li></ul><ul><li>Prev/Next links above/below and statically placed. </li></ul>Date Picker. Text field, dropdown, popup calendar or embedded? Date of birth versus flight booking? Demarcate information. Group information. Borders, background colors, gutters. URL as a UI. Helps RESTful & SEO.
  9. 9. IA/UI/UX Don’t make the user think Assume user has bad memory, is a poor decision maker and extremely slow and lazy. Design for this user. Design for accessibility? No JS. No Flash. Text based. Screen readers. Mobile. Etc. Text as a UI (h1, p, anchors, alignment, wrapping, line-height, font-size) Prefer two-level nesting. No more than three. H1, H2, H3. Nav and Sub Nav. Two level lists. Well formed HTML. Semantic. Microformats. Use alt, title, label, etc. Use white space and gutters. Margins, padding or even borders?
  10. 10. Process Ship it! Keep it simple Daily, Weekly, Monthly milestones Build First. Refine Later. Version control, bug tracking, wiki, QA 1 great developer better than 20 bad ones. 2-3 person startups. Early on get jack of all, master of many Later on get jack of few, master of one One step build. One step publish. Beta
  11. 11. Web Architecture Stateless. GET, POST, sessions, cookies Centralized. Easy deploy. Quick bug fix turnaround (Gmail has gone as low as 4 hours) Fat servers, thin clients but getting richer. (Canvas/SVG/XUL, Offline storage, RIA). Versioning. Everyone on same page. Instantaneous update. Build numbers to track problems. Security. Runs in a sandbox environment. Security getting tighter. Works everywhere. Creeping up on desktop. Bandwidth. Latency. ASync. Caching. Preloading. Progressive rendering. display/position/DOM manipulation
  12. 12. Web Stack HTTP: GET, POST, PUT, DELETE (HTML4 lacks support) HTTP: 2/4 concurrent browser limit. IE8 6/6. Do ASync. HTTP: GZIP, Deflate HTTP Servers: Comet (Push). Yahoo Push. Single connection. No setup/teardown. HTML: Semantic, HTML not XHTML. No CSS. No JS. CSS: Weight, Cascasde (LI:1, UL LI:2, LI.red: 11, #menu: 100). CSS: Box Model (Margin, Padding, Borders) CSS: Selectors, DOM, CSS3 (sibling, descendant, first, last), Class vs ID
  13. 13. Web Stack JavaScript: faster engines ahead (v8/chrome, tracemonkey/FF) JS: Use JSON. Avoid XML, CSV Don’t inline JS: Object based. Objects are dictionaries (KVP) JS: Object literal syntax Do minify JS: Object detection not browser detection
  14. 14. Web Stack Build RESTful services and web APIs Frameworks: MVC, ORM (EF, nHibernate), Blueprint/960.gs, jQuery Automate: 1 step build, 1 step publish. Tools: firebug, resharper, fiddler, trac, wfetch Caching: Server, Client, DB I/O: memcached. ASP.NET application static vars DB: Denormalized. Add fields as needed. Hints from the UI.
  15. 15. Strategy: Platform Strategy Everyone uses the platform. Seeks broad adoption. Microsoft Windows ME seeks to be the underlying platform for smart phones. iPhone seeks to build it’s own phones. WordPress. jQuery You dictate the roadmap. Microsoft promotes OEMs. Platform allows others to build on top of it. Apple controls the entire vertical. Provides a developer platform (Xcode + AppStore)
  16. 16. Strategy: Ecosystem Strategy Everyone contributes. Everyone benefits. Give to get. Microsoft has an ecosystems strategy. Partners, vendors, certifications, OEMs, OS, Office, .NET/VS etc. Needs a platform. Entire ecosystem is self sustaining. Apple has an ecosystems strategy. Retail, manufacturing, support, development, OS, applications, training, IDE/SDK, etc. MS can get into AV, Browsers, Media, Keyboards, etc. Internal demand alone will make it sustainable.
  17. 17. Strategy: Blue Ocean Strategy Nintendo Wii. Didn’t compete. Created new segment. Bing does not want to be a search engine. Wants to be a decision engine. Create new demand. Differentiation is central
  18. 18. Strategy: Disruptive Strategy Element of Surprise. GMail. Apple notorious for secrecy. Competitors find it hard to react (resources, planning) Gmail was extremely disruptive. Entire industry reacted. IE disrupted NS. GMail disrupted Hotmail. iPhone/BB disrupted Nokia/Motorola.
  19. 19. Strategy: Embrace & Extend Microsoft’s Strategy Wait for market to validate then E&E. Need resources. Need foresight. Need ecosystem. IE disrupted NS. GMail disrupted Hotmail. iPhone/BB disrupted Nokia/Motorola.
  20. 20. Strategy: Tiny verticals, Long tail Easy to build Easy to manage Can respond quickly. Can iterate quickly. Specialization is advantageous. Do one thing and do it well. Can interface directly with users. They will endorse you. If the pie is big, multiple players can exist and verticals can thrive. If the market is competitive or the leader is big, build a vertical.
  21. 21. Strategy: Competitive Strategy Seed it. StackOverflow seeded with industry leaders. Differentiate. Some like it hot, some like it cold. Bing design is polar opposite of Google. Build it better with newer tools. StackOverflow (Web2.0) versus Experts Exchange Communities: Deep engagement. Don’t fraternize. Expertise. You can’t build an online shoe store if you have never worked in one. You can’t do supply chain if you don’t know wholesalers, retailers, have credit in market. Partner or build a platform. Strong value proposition. Cross-sell. Up-sell.
  22. 22. Reach Out Email [email_address] LinkedIn tinyurl.com/onlinestrategy Personal aleembawany.com Please drop an email to say hello & introduce yourself. Or for questions, feedback & guidance. Looking for great developers on the biggest portal project .

×