Online Strategy Development In a nutshell Big Picture

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? On demand: Google Search. URLs. Viral: email, facebook, youtube. Collaborative: Wiki. Pedia, Open source, Google Maps. Trackbacks. Comments. Forums. Noisy. Information Overload (Twitter) Permanent: No undo. Archives. No space constraints. Cumulative. Now Social.

Analytics What is being clicked ? Who is being read? How much time is being spent on a page? What pages are being loaded? What is the navigation path? Real time Ad placement, sales, context.

Demographic Profiling & Targetting Dawn targets individuals & households. Sunday print has magazine from women, children’s section, classifieds etc. i. Phone targets the more tech savvy. Older generation finds it complex. Prefers tactile feedback. Localization & internationalization

IA/UI/UX Returning or new? Search or browse? Discoverability. Gmail now has drag/drop. Hours, minutes or seconds? On-boarding Process? Goal? Time? Clicks? Rozee. pk gets it. Jang doesn’t but lacks competition. Reduce clicks, roundtrips, scroll On. Mouse. Down or On. Mouse. Click? Graceful degradation Progressive rendering

IA/UI/UX Validation with JS, app or DB? Date Picker. Text field, dropdown, popup calendar or embedded? Date of birth versus flight booking? URL as a UI. Helps RESTful & SEO. Demarcate information. Group information. Borders, background colors, gutters. Interaction design: Image gallery -Keyboard left and right. - Image width/height attributes set (avoids redrawing, attributes available to JS earlier). - Prev/Next links but carousel even better. - Prev/Next links above/below and statically placed.

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. Use white space and gutters. Margins, padding or even borders? Prefer two-level nesting. No more than three. H 1, H 2, H 3. Nav and Sub Nav. Two level lists. Text as a UI (h 1, p, anchors, alignment, wrapping, line-height, font-size) Well formed HTML. Semantic. Microformats. Use alt, title, label, etc.

Process Ship it! Keep it simple Build First. Refine Later. Daily, Weekly, Monthly milestones 1 great developer better than 20 bad ones. 2 -3 person startups. Early on get jack of all, master of many Version control, bug tracking, wiki, QA One step build. One step publish. Later on get jack of few, master of one Beta

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

Web Stack HTTP: GET, POST, PUT, DELETE (HTML 4 lacks support) HTTP: 2/4 concurrent browser limit. IE 8 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, CSS 3 (sibling, descendant, first, last), Class vs ID

Web Stack Java. Script: faster engines ahead (v 8/chrome, tracemonkey/FF) JS: Use JSON. Avoid XML, CSV JS: Object based. Objects are dictionaries (KVP) JS: Object literal syntax JS: Object detection not browser detection Don’t inline Do minify

Web Stack Build RESTful services and web APIs Frameworks: MVC, ORM (EF, n. Hibernate), Blueprint/960. gs, j. Query Tools: firebug, resharper, fiddler, trac, wfetch I/O: memcached. ASP. NET application static vars Automate: 1 step build, 1 step publish. Caching: Server, Client, DB DB: Denormalized. Add fields as needed. Hints from the UI.

Strategy: Platform Strategy Everyone uses the platform. Seeks broad adoption. You dictate the roadmap. Apple controls the entire vertical. Provides a developer platform (Xcode + App. Store) Microsoft Windows ME seeks to be the underlying platform for smart phones. i. Phone seeks to build it’s own phones. Word. Press. j. Query Microsoft promotes OEMs. Platform allows others to build on top of it.

Strategy: Ecosystem Strategy Everyone contributes. Everyone benefits. Give to get. Entire ecosystem is self sustaining. Apple has an ecosystems strategy. Retail, manufacturing, support, development, OS, applications, training, IDE/SDK, etc. Needs a platform. Microsoft has an ecosystems strategy. Partners, vendors, certifications, OEMs, OS, Office, . NET/VS etc. MS can get into AV, Browsers, Media, Keyboards, etc. Internal demand alone will make it sustainable.

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

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. i. Phone/BB disrupted Nokia/Motorola.

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. i. Phone/BB disrupted Nokia/Motorola.

Strategy: Tiny verticals, Long tail Easy to build If the pie is big, multiple players can exist and verticals can thrive. Easy to manage Can respond quickly. Can iterate quickly. Can interface directly with users. They will endorse you. Specialization is advantageous. Do one thing and do it well. If the market is competitive or the leader is big, build a vertical.

Strategy: Competitive Strategy Differentiate. Some like it hot, some like it cold. Bing design is polar opposite of Google. Communities: Deep engagement. Don’t fraternize. Strong value proposition. Crosssell. Up-sell. Build it better with newer tools. Stack. Overflow (Web 2. 0) versus Experts Exchange Seed it. Stack. Overflow seeded with industry leaders. 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.

Reach Out Email aleemb@gmail. com Linked. In 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.