How to Create a Successful Web App & Cloud Based Startup in Armenia

818 views

Published on

It all starts with an Idea. Take your idea and learn how to create your own Cloud Based Startup in Armenia. Learn the technology and paths to needed to having a profitable company.

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

  • Be the first to like this

No Downloads
Views
Total views
818
On SlideShare
0
From Embeds
0
Number of Embeds
161
Actions
Shares
0
Downloads
11
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

How to Create a Successful Web App & Cloud Based Startup in Armenia

  1. 1. How to Create a Successful Web App & Cloud Based Startup in Armenia -Todd Fabacher
  2. 2. Multi Platform
  3. 3. We live in a Multi Device world
  4. 4. What Does that mean for me?
  5. 5. Responsive Design
  6. 6. Fluid Grids
  7. 7. CSS Media Queries @media screen and (min-width: 480px) { .content { float: left; } .social_icons { display: none } // and so on... } ● 480px ● 600px ● 768px ● 900px ● 1200px
  8. 8. HTML <div class="section group"> <div class="col span_1_of_3"> This is column 1 </div> <div class="col span_1_of_3"> This is column 2 </div> <div class="col span_1_of_3"> This is column 3 </div> </div>
  9. 9. CSS /* SECTIONS */ .section {clear: both; padding: 0px; margin: 0px;} /* COLUMN SETUP */ .col {display: block; float:left; margin: 1% 0 1% 1.6%;} .col:first-child { margin-left: 0; } /* GROUPING */ .group:before, .group:after {content:""; display:table;} .group:after {clear:both;} /* GRID OF THREE */ .span_3_of_3 {width: 100%;} .span_2_of_3 {width: 66.1%;} .span_1_of_3 {width: 32.2%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .col { margin: 1% 0 1% 0%;}} @media only screen and (max-width: 480px) { .span_3_of_3 {width: 100%; } .span_2_of_3 {width: 100%; } .span_1_of_3 {width: 100%;}}
  10. 10. What it will Look Like
  11. 11. How it Works /* SECTIONS */ .section {clear: both; padding: 0px; margin: 0px;} .section splits up the page horizontally. You'll need a few of these to break up the content, and you can use them in your main wrapper, or within other divs.
  12. 12. How it Works /* COLUMN SETUP */ .col {display: block; float:left; margin: 1% 0 1% 1.6%;} .col:first-child { margin-left: 0; } .col divides the section into columns. Each column has a left margin of 1.6% (around 20 pixels on a normal monitor), except the first one. Using. col:first-child { margin-left: 0; } means you don't need to use class=" last"anywhere. It works in all browsers since IE6.
  13. 13. How it Works /* GROUPING */ .group:before, .group:after {content:""; display:table;} .group:after {clear:both;} .group solves floating problems, by forcing the section to self clear its children (aka the clearfix hack). This is good in Firefox 3.5+, Safari 4+, Chrome, Opera 9+ and IE 6+.
  14. 14. How it Works /* GRID OF THREE */ .span_3_of_3 {width: 100%;} .span_2_of_3 {width: 66.1%;} .span_1_of_3 {width: 32.2%;} .span_1_of_3 specifies the width of the column. Using percentages means it's 100% fluid.
  15. 15. How it Works /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max- width: 480px) { .col { margin: 1% 0 1% 0%;}} @media only screen and (max- width: 480px) { .span_3_of_3 {width: 100%; } .span_2_of_3 {width: 100%; } .span_1_of_3 {width: 100%;}} @media queries as soon as the screen size gets less than 480 pixels the columns stack and the margins disappear.
  16. 16. Responsive Example
  17. 17. Object Manipulation
  18. 18. Responsive Web Design Book teamtreehouse.com Classes Tutsplus.com How-To Articles This Is Responsive Resources Learning More
  19. 19. Framework
  20. 20. Bootstrap ● From Twitter ● 12-grid responsive layout ● Custom jQuery plugins for common UIs like carousels and modal window ● Bootstrap customizer ● Well documented with lots of examples ● getbootstrap.com
  21. 21. Skeleton ● simple and clean responsive CSS boilerplate for HTML5 ● Grid responsive layout ● A PSD template for mocking up your web designs ● If you want to get started with responsive design quickly ● www.getskeleton.com
  22. 22. Foundation ● From ZURB ● 12-grid responsive layout ● Rapid-prototyping capabilities ● Prototyping ● Well documented with lots of examples ● foundation.zurb.com
  23. 23. Responsive Design Framework
  24. 24. CMS Systems
  25. 25. Why are CMS good? ● Frameworks ● Marketplace ● Themes / Plugins ● Large Community ● Open Source
  26. 26. Example: GeoTheme
  27. 27. Create a Global Directory! Expandable Google Map V3 with Ajax markers Connect with Social Media
  28. 28. Recurring events option Enhanced Listings with Recurring Payments Review management for place owners
  29. 29. Web Apps Frameworks
  30. 30. Make it Native
  31. 31. Starts with an Idea
  32. 32. 1st 2nd ?
  33. 33. 47.37%Odds for Red
  34. 34. 0.0047% Odds to create another Social Site
  35. 35. Know your Competition
  36. 36. Find the Niche
  37. 37. Armenian Cloud 5. SaaS
  38. 38. Development
  39. 39. YOU
  40. 40. YOU How to get help? Find other freelancers? Where to get help? What areas do you need help?
  41. 41. YOUR TEAM Global Female Mixed Abilities
  42. 42. How to Make
  43. 43. Advertising & Sponsors
  44. 44. Advertising & Sponsors?
  45. 45. $236,000
  46. 46. Subscribers
  47. 47. Advertisers 200
  48. 48. Advertising Income Business = $99 per year Enhanced = $199
  49. 49. Subscribers 2,000
  50. 50. Web App Income Consumer = $6.99 Business = $29.99 per month
  51. 51. Web App Income Consumer = $13,980 Business = $59,980 per month
  52. 52. Income from Different Areas ContractBusiness Consumer
  53. 53. Save This
  54. 54. Heartbeat Income
  55. 55. The Death Chair
  56. 56. Marketing
  57. 57. What about Social Media?
  58. 58. Content Marketing
  59. 59. Goal: 5,000 Views Challenge : 1. Interactive Campaign - no blog 2. Graphical 3. Link Armenia with WordPress
  60. 60. Our choice 1. Graphical 2. Embeddable 3. Open roads to new viewers 4. Linked to Economic Development
  61. 61. 188,000+ ViewsResults : 1. Embeds in 17 websites 2. 382 downloads, 32 likes, 10 comments 3. 400+ social media activities 4. Most talked about on LinkedIn
  62. 62. Blogging
  63. 63. Blogging 1. Improves Communication 2. Crystalize Thoughts 3. Feedback on Ideas 4. Forces Learning 5. Create More Content 6. Build Credibility
  64. 64. Advertising ..Targeted Only.. $5,000 - Page per month
  65. 65. Marketing Tips 1. Customers determine your priority 2. Focus on your customers and the money will follow 3. Word of mouth = $$$ 4. It is a numbers game 5. Patience, success takes time
  66. 66. 中 國 Don't Just Look West
  67. 67. 1990
  68. 68. 1996
  69. 69. 2010
  70. 70. 520Million 200Million 140Million 140Million China USA Growth2015Online Shoppers
  71. 71. Շնորհակալություն Todd Fabacher toddf@itechnology.am

×