apps voor mobiele toestellen
TRANSCRIPT
Mobile Apps
Wat zijn Apps?App = applicatieProgramma voor smartphone of tabletLaat personalisatie toeMeest populair: Angrybirds (betalend)Facebook (niet betalend)De duurste: VIP Black -- $999.99 (de
miljonair app)
Wat is een goede app?Wat wil je bereiken?Voor wie?Wat doet dit meer dan website, folder?
• Gemakkelijker• Sneller• Meer functionaliteiten (integratie met
kalender, newsfeed, kaart)
Smartphones - TabletsSmart devices (toestellen) in alle soorten en
matenAndere prijsklasse ≠ snelheid en geheugen
Wanneer gebruik je wat?Laptop: creeren en bewerken van
informatieTablet: info benaderen, lezen, browsen,
media consumptie, noteren, annoteren, tussendoor werk
Smartphone: sms, email, flitsend werk
Besturingsysteem
OS (Operating System)
Operating SystemVerschillende fabrikant – verschillende OS iOS (Apple): IPhone, IPadAndroid (Google): Samsung, HTC…Windows Phone 8 (Microsoft): Nokia…: Blackberry: eigen OS…
Verkoopscijfers
http://www.onbile.com/info/mobile-operating-system-evolution-in-2012/
Markt in 2012
iOSOntwikkeling van een iPhone of IPad app
is niet zo complex, omdat je te maken hebt met één fabrikant en één type toestel
Soft- en hardware zijn perfect afgestemd iOS wordt steeds geupdateNieuwe apps werken niet op oude
toestellen
iOSVlot, intuïtiefOp homescreen enkel snelkoppelingenAfgesloten OS, geen flashNadruk op multimedia, niet op
bestandsbeheerBlijven de referentie
AndroidVeel fabrikanten ontwikkelen
AndroidtoestellenGrote variëteit in toestellen en
toestelspecificatiesVaak noodzakelijk om binnen één app drie
varianten te ontwikkelen (low, medium en high) om zo alle toestellen optimaal te kunnen bedienen
Alle apps werken niet op alle versies van Android
AndroidMarktleiderOpen OSVeel fabrikanten ontwikkelen
AndroidtoestellenGrote variëteit in toestellen en
toestelspecificatiesVolledige connectiviteit bvb Bluetooth (BT)Gecertificeerd door Google (is van Google)
WP8 Windows Phone 8Vlotte en intuïtieve interfaceLive Tiles Homescreen met beperkte infoBeperkte BT connectiviteitZeer afgesloten OS...Zie presentatie
Verschillende formaten
3 soorten AppsNative
Web
Hybrid
Voorbeeld Dag v d commWebsiteMobiele websiteapp
Native Apps
Native AppsNative Apps zijn kleine
softwareprogramma’s ontworpen om een specifiek platform te draaien.
Ontworpen voor specifieke toestellen of Operating Systems.
Een Android App zal dus niet werken op een iPhone
Native AppsHet programma wordt op de smartphone
of tablet geïnstalleerdMultitasking: verschillende applicaties
draaien samen (op achtergrond)
Native AppsGeschreven in de broncode (binair
executable)Veel programmeerwerkOp maat: echte mobiele AppKunnen werken zonder internet Wel telkens update als inhoud wijzigtUpdate opnieuw in de store of market
indienen en door gebruiker te downloaden
Native App
Voor ieder OS broncode opnieuw programmeren in andere programmeertaal
Duur in aanmaak (verschillende platformen)
Duur in onderhoudWel snel
Native App
Native Apps Interactie rechtstreeks met het OS
(Operating System)Geen container app nodigGebruikt de APIs van het OSToepassingen, locatiegegevens,
informatie, camerabeelden, en contacten kunnen tegelijk verwerkt worden
Dezelfde look-and-feel als OS
Native AppsOphalen via app marktplaats zoals Itunes
of App Store (Apple), Play Store (Android), Windows Phone Market (Microsoft),…
Wordt gedownload en opgeslaan op mobiele toestel
Opstarten door ikoon aan te raken op scherm
Voorbeelden Native Apps
Skype App (Iphone) , Twitter en Foursquare (Android), Shazam, Wordlands, Angry Birds
Web Apps
Web AppMeeste gewone websites niet geschikt om
mobiel te bezoeken Inhoud valt buiten beeld, beelden worden
slecht geladen …Mobiele website of web app houdt
rekening met capaciteit mobiele apparaatEnkel belangrijke informatie wordt getoondAdresbalk kan weggelaten worden
Web Apps Inhoud moet elke keer ingeladen worden Internetverbinding noodzakelijk Installatie op OS optioneelSoms ook Offline beschikbaar (te
gebruiken zonder internet-connectie)Minder snel dan Native AppsMoeilijk verkoopbaar (niet via Play Store
(Android) of App Store (Apple) )
Voorbeelden Web Apps
Web App openenDoor URL in te tikkenDoor op een hyperlink te klikkenQR-code kan gekoppeld (gescand) worden
aan URLVia snelkoppeling op home-schermVanuit de browsers roept de gebruiker
bepaalde inhouden op die aangepast zijn aan de resolutie en grootte van het scherm.
Web AppGeschreven in html (html5), CSS (CSS3) en
Javascript (frameworks)Werken in de browser
Chrome (Google), Internet Explorer (Microsoft), Firefox (Mozilla) ...
Geoptimaliseerd voor Mobile devicesHerkennen automatisch mobiel surfenComfortabele ‘touch experience’ op kleiner
schermDraaien op alle OS
HTML5Hyper Text Markup LanguageHTML5 is een potentiele kandidaat voor
cross-platform mobile applicaties. Veel eigenschappen zijn gebouwd met de
bedoeling vlot te draaien op lage energie toestellen zoals smartphones en tablets
Nog in ontwikkeling
Html 5
Html 5
Javascript frameworks
Javascript frameworksWeb Apps worden gemaakt met Javascript
ToolkitsOntwikkel-omgevingVereenvoudigt de ontwikkeling van
websites en applicaties voor mobiele toestellen en platformen
Werkt op alle populaire smartphone-, tablet-, e-reader- en desktopplatformen en moderne (mobiele) browsers: iOS, Android, BlackBerry, PalmOS, WebOS, Nokia/Symbian, Windows Phone 7, MeeGo, Opera Mobile/Opera Mini, Firefox Mobile, Kindle, Nook
Voorbeelden Javascript Toolkits
CSS 3
CSS 3CSS = Cascading StyleSheetsCSS is een stylesheet-taal gebruikt om de
‘presentatie-semantiek’ (uitzicht van teksten) weer te geven
Bedoeling is het scheiden van vorm (layout, kleuren lettertypes) en inhoud
Sass = Syntactically Awesome Stylesheets
Responsive design
Responsive designMobiele website past zich aan in functie
van het schermData (eventueel via database) koppelen
aan html5Javascript checkt versie en formaat van
toestelAfhankelijk hiervan worden verschillende
css ingeladen
Responsive designLet op voor beelden, beschikbaar maken
in kleinere formaten Eventueel teksten inkortenKnoppen moeten herplaatst kunnen
worden
Responsive design: website
Responsive design: tablet
Responsive design: phone
Web Sites – Web Apps
Web Sites leunen aan bij de klassieke sites
Web Apps lijken op Native Apps
Native vs Web
Voorbeelden Native vs Web
Voorbeelden Native vs Web
Voorbeelden Native vs Web
Hybride App
Hybride AppCombinatie van beide Interessant binnen bedrijfswereldEr wordt een schil gebouwd waarbinnen
de mobiele site geladen wordt Is een Native App met daarin (embedded)
de htmlAlle voordelen van native Apps
Hybride AppVast basisgeraamteDelen zijn geschreven in web-taalVia RSS wordt inhoud actueel gehouden Internet is dus nodigMaar telkens inhoud verandert noet native
App niet aangepast worden
Alle elementen van een mobiel toestel
http://www.slideshare.net/jamesgpearce/cross-platform-mobile-web-appshttp://www.slideshare.net/jamesgpearce/building-cross-platform-mobile-web-apps-7925215
Web View
Web ingebed in Native
Voorbeeld Sp!tsnieuws
Voorbeeld Sp!tsnieuwsLinks en midden: mobiele site In het midden krijgen bezoekers eenmalig
de mogelijkheid om de site te bookmarken.
Op deze manier verschijnt er al een icon op het scherm van de telefoon waarmee de mobiele site geopend kan worden.
Voorbeeld Sp!tsnieuws
Voorbeeld Sp!tsnieuwsAan de rechterkant is de hybride app
weergegevenNavigatie items bovenin de mobiele site
zijn vervangen door een app navigatie onderaan het scherm
Voorbeeld Sp!tsnieuws
Voorbeelden Hybride Apps
Vergelijken
DistributieMarketplacesZorg dat je gevonden wordt (730,686 apps
in iTunes Store)App SEO
http://www.slideshare.net/kolinko/app-store-seo-tutorial
http://www.slideshare.net/misteroo/how-to-market-your-app
Zorg voor grote marktpenetratiePlatform vs User Reach
Platform vs User Reach
http://www.slideshare.net/andreasc/101-myths-about-the-mobile-economy
Welke appsNuttige apps in bedrijfscontext:
Blacklisting, whitelisting: stalkers uitschakelen, nrs die bellen krijgen dan bezettoon, whitelist is dan enkel één nr toelaten in bvb vergadering
Annoteren pdfScannen OCRMemorecorderRemote desktop: scherm pc overnemenRSS vb flipboard
Welke appsNuttige apps in bedrijfscontext:
Qr en barcode scanningNavigatie vb google maps best via app, kaarten
worden dan op toestel ingeladen, anders via browser veel dataverkeer
NMBSPdf goodreader of ez-reader voor androidApp van bankcontacten van Belfius
Toekomst
Mobiele Web 3.0
http://www.slideshare.net/TerryRibb/web-30-platforms-devcon5-conference
Mobiele Web 2.0 vs 3.0
Voorbeeld Web 2.0 Starbucks
Web 3.0Semantische bovenlaag
A personal agent
Semantische data, Agents, interacties
Voorbeeld Siri
Categorie 1 Categorie 2 Categorie 3 Categorie 40
1
2
3
4
5
6
Reeks 1Reeks 2Reeks 3
Voorbeeld Tripit
Voorbeeld iFood
ToekomstNaast de applicaties op zich, ontstaat ook
een volledig nieuw marketing en salesinstrument
Remoteapp (bediening van op afstand)Digital enhanced serviceDiensten en producten controleren en
monitoren
http://www.slideshare.net/tijs/the-future-op-apps
http://pinterest.com/tijs/smart-app-devices/
ConceptueelManage de taken, niet de technologieBehandel mobiele bezoekers als echte
mensen, zoals in een winkel, aan het loket, enz.
Uw mobiele website IS uw kantoor, loket, werkvloer
Doordring de technologiemensen ervan dat de bezoeker eerst komt, niet de organisatie
ConceptueelMobiele gebruikers willen niet de ‘volledige
site’, ze willen de ‘volledige ervaring’Sam Walton:‘The secret of successful retailing is to give your customers what they want.’Jakob Nielsen:‘Mobile is less forgiving than the desktop.’
Meer Info en bronnenUitstekende video van Worklight (IBM) die
ik gevolgd heb bij met maken van deze presentatie (http://youtu.be/Ns-JS4amlTc)
Meer technische info en schema’s http://youtu.be/Ns-JS4amlTc http://www.youtube.com/watch?v=Ns-JS4amlTc&feature=related http://www.slideshare.net/jamesgpearce/cross-platform-mobile-w
eb-apps http://www.slideshare.net/jamesgpearce/building-cross-platform-
mobile-web-apps-7925215
Meer info en bronnen http://www.slideshare.net/TerryRibb/web-30-platforms-de
vcon5-conference http://www.frankwatching.com/archive/2012/04/16/iphon
e-android-rim-zijn-hybride-apps-de-oplossing/
Nog te verwerken:http://wijs.be/trends-inzichten/blog/detail/native-app-of-web-app