advertisement

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

50 %
50 %
advertisement
Information about How to Create a Successful Web App & Cloud Based Startup in Armenia
Business & Mgmt

Published on October 11, 2013

Author: digitalpomegranate

Source: slideshare.net

Description

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.
advertisement

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

Multi Platform

We live in a Multi Device world

What Does that mean for me?

Responsive Design

Fluid Grids

CSS Media Queries @media screen and (min-width: 480px) { .content { float: left; } .social_icons { display: none } // and so on... } ● 480px ● 600px ● 768px ● 900px ● 1200px

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>

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%;}}

What it will Look Like

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.

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.

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+.

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.

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.

Responsive Example

Object Manipulation

Responsive Web Design Book teamtreehouse.com Classes Tutsplus.com How-To Articles This Is Responsive Resources Learning More

Framework

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

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

Foundation ● From ZURB ● 12-grid responsive layout ● Rapid-prototyping capabilities ● Prototyping ● Well documented with lots of examples ● foundation.zurb.com

Responsive Design Framework

CMS Systems

Why are CMS good? ● Frameworks ● Marketplace ● Themes / Plugins ● Large Community ● Open Source

Example: GeoTheme

Create a Global Directory! Expandable Google Map V3 with Ajax markers Connect with Social Media

Recurring events option Enhanced Listings with Recurring Payments Review management for place owners

Web Apps Frameworks

Make it Native

Starts with an Idea

1st 2nd ?

47.37%Odds for Red

0.0047% Odds to create another Social Site

Know your Competition

Find the Niche

Armenian Cloud 5. SaaS

Development

YOU

YOU How to get help? Find other freelancers? Where to get help? What areas do you need help?

YOUR TEAM Global Female Mixed Abilities

How to Make

Advertising & Sponsors

Advertising & Sponsors?

$236,000

Subscribers

Advertisers 200

Advertising Income Business = $99 per year Enhanced = $199

Subscribers 2,000

Web App Income Consumer = $6.99 Business = $29.99 per month

Web App Income Consumer = $13,980 Business = $59,980 per month

Income from Different Areas ContractBusiness Consumer

Save This

Heartbeat Income

The Death Chair

Marketing

What about Social Media?

Content Marketing

Goal: 5,000 Views Challenge : 1. Interactive Campaign - no blog 2. Graphical 3. Link Armenia with WordPress

Our choice 1. Graphical 2. Embeddable 3. Open roads to new viewers 4. Linked to Economic Development

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

Blogging

Blogging 1. Improves Communication 2. Crystalize Thoughts 3. Feedback on Ideas 4. Forces Learning 5. Create More Content 6. Build Credibility

Advertising ..Targeted Only.. $5,000 - Page per month

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

中 國 Don't Just Look West

1990

1996

2010

520Million 200Million 140Million 140Million China USA Growth2015Online Shoppers

Շնորհակալություն Todd Fabacher toddf@itechnology.am

Add a comment

Related presentations

Canvas Prints at Affordable Prices make you smile.Visit http://www.shopcanvasprint...

30 Días en Bici en Gijón organiza un recorrido por los comercios históricos de la ...

Con el fin de conocer mejor el rol que juega internet en el proceso de compra en E...

With three established projects across the country and seven more in the pipeline,...

Retailing is not a rocket science, neither it's walk-in-the-park. In this presenta...

What is research??

What is research??

April 2, 2014

Explanatory definitions of research in depth...

Related pages

Build Your Own Web or Mobile App In Minutes With These ...

The cloud based platform builds your App with 100% ... unless your app is successful ... Easily create apps using the web technologies ...
Read more

FREE Offer for BizSpark Members -Startups | Microsoft Azure

Learn how startups that join Microsoft's BizSpark program ... Machine Learning Powerful cloud based ... Create an ASP.NET Web App Create an ASP ...
Read more

Introduction to Excel Web App - Excel

Microsoft Excel Web App extends your Microsoft Excel experience to the web browser, where you can work with workbooks directly on the website where the ...
Read more

Create your own Cloud Storage Server in 5 Minutes! - OwnCloud

This video will show you how to create your own private cloud in ... Create your own Cloud ... cloud in five minutes using a web ...
Read more

Google App Engine - Wikipedia, the free encyclopedia

Google App Engine (often referred to ... This service allows to create, configure, ... Chrome Web Store; Apps; Extensions; Cloud Print; Earth. Sky; Moon; Mars;
Read more

Wordle - Create

Create: Credits: Forum: FAQ: ... Paste in a bunch of text: Go. or. Enter the URL of any blog, blog feed, or any other web page that has an Atom or RSS feed ...
Read more

Azure Documentation Articles

Create an ASP.NET Web App Create an ASP.NET web ... Add a cloud-based backend service to an iOS app using ... documentation articles ...
Read more

Adobe Creative Cloud - Wikipedia, the free encyclopedia

Adobe Creative Cloud; ... a multimedia authoring program used to create web applications, ... Web hosting and cloud-based file hosting storage space and ...
Read more

Create a build definition on TFS

Create a build definition on Visual Studio Team ... Cloud-based Load Test; Cloud-based Web ... need to build a .NET app. Start with an ...
Read more