© Daniel Sundberg 2007

TNMK024 - Mobilprogrammering

Föreläsare

● Daniel Sundberg– Medieteknik 2000-2005– Exjobb Silicon Graphics Inc.

● Designing and Implementing a 3D User Interface

– Forskaringenjör NVIS 2005-2007– Mjukvaruarkitekt VION Solutions AB

Föreläsningar

● Intro till Java för mobila enheter– MIDP, CLCD, JSR, Mobile Processing etc.

● Animeringar, sprites etc.● Blåtandskommunikation i praktiken

Kort om Java

Platformsoberoende

”Compile once, run everywhere”

1. Javakod (.java)

2. Kompilator (javac)

3. Bytekod (.class)

4. Virtuell Maskin (java)

5. Interpreteras till maskinkod

6. Applikation körs

Java ME (Micro Edition)

● Applikationsplatform för mobila enheter● Designat för att köras på många typer av enheter● Mobiler, PDA, digitalboxar, brödrostar etc.● Består av olika komponenter● Java Community Process (JCP)

JCP och JS R

● Stort community som tar fram s.k. Java Specification Requests (JSR)

● Formella dokument för teknologier som läggs till i Java platformen

● 300+ JSRer● ME (76 JSRs) ● SE/EE (212 JSRs)

● Exempel är JSR 118, definitionen för MIDP 2.0

J2ME paket

● J2ME är uppbyggt av olika API paket● Olika pakettyper

● Konfigurationer● Profiler● Valbara paket

● Vi är intresserade av sammansättningen av MIDP och CLDC samt Bluetooth

MIDP och CLDC

● Mobile Information Device Profile– MIDP 1.0 (JSR 37)– MIDP 2.0 (JSR 118)

● Connected Limited Device Configuration– CLDC 1.1 (JSR 139)

● Java API for Bluetooth (JSR 82)

Process ing

● Programmerings IDE● Prototypning● Wrapper kring Java● Låg inlärningskurva● ”Vanlig” Java-kod

Mobile Process ing

● Lika som Processing● Java ME● Korta utvecklingstider● ”Allt” klart● Tuta och köra

Mobile Process ing

● Wrappers för snabb start● Full access till alla java APIer● Java's emulator för testning● JAR paketering

Länkar

● APIer– http://java.sun.com/javame/reference/apis.jsp

● Java Specification Requests– http://jcp.org

● Processing– http://www.processing.org– http://mobile.processing.org

MobilprogrammeringAnimeringar, sprites m.m.

Innehåll

● Animera objekt● Sprites● Lager● Tilade lager● Bakgrunds parallax

Animering

● Animera– Samlingsnamn för rörliga bilder, skapade genom

fotografering av teckningar eller objekt (dockor, lerfigurer, silhuetter e.d.) eller i dator. En filmkamera tar en eller ett fåtal bildrutor av varje teckning eller rörelsefas. Då filmen visas med normal hastighet flyter de enskilda bilderna samman till en kontinuerlig rörelse.

Animera objekt

● Flytta positionen på objekt mellan renderingar● Förändra objekt mellan renderingar● Målet oftast att skapa en kontinuerlig rörelse

Animera

Exempel

S prite

● Från början en metod för att i hårdvara rendera multipla objekt till skärmbufferten

● Datorerna blev snabbare, kunde lösa samma problem generiskt, namnet kvar

● Generellt menas 2D bild som integreras i en större scen

● Oftast har en sprite många bildrutor och kan animeras

S prite

● Inte nödvändigtvis en lågupplöst pixlad bild i datorspel

● Används ofta även som effekter i 3D-spel, filmer etc.

● Billigt sätt att skapa effekter● I 3D är en sprite alltid en ”billboard”, objekt som

alltid är riktat mot kameran

S prites i MIDP

● Inbyggt stöd för sprites i MIDP● Håller koll på:

– Bildrutor– Animering– Kollision

● Definiera animations mönster

S prites i MIDP

S prites i MIDP

● setFrame(int)● nextFrame()● prevFrame()

S prites i MIDP

● Definiera special sekvenser för mer kontroll på animationen

S prites

Exempel

Lager

● Smidigt sätt att hantera multipla objekt● Separera bakgrund, objekt etc.● MIDP har en lagerhanterare

TiledLayer i MIDP

● Bygga större bilder av mindre bitar, tiles● Sparar minne då man slipper att lagra jättestora

bilder● Enkelt att göra olika designer

TiledLayer

TiledLayer

TiledLayer - Animering

TiledLayer - Exempel

● Några tiles från SuperMario i Mobile Processing

TiledLayer

Exempel

© Daniel Sundberg 2007

S crollande bakgrund

● Enkelt sätt att skapa en värld som är större än skärmen

● Använd med fördel TiledLayers● Bakgrunden kan loopas för en ”oändlig” värld

S crollande bakgrund

Exempel

Parallax scrollning

● En variant av scrollande bakgrunder● Byggs upp av olika lager

– Förgrund– ...– Bakgrund

● Rör sig med olika hastigheter för att skapa en djupkänsla

Parallax scrollning

Parallax scrollning

Parallax S crollning

Exempel

Parallax scrolling

● Att tänka på– Hastigheter mellan lager– Ordningen på lagren

Allt-i-ett

Resultat

Mobilprogrammering

Feedback/Återkoppling

Återkoppling/Feedback

● Principen att föra tillbaka signaler från ett system och låta denna information i sin tur påverka systemet.

● Används inom användargränssnitt för att t.ex. påkalla fokus

● Används inom spel för att t.ex. förstärka upplevelsen

Återkoppling exempel

● Tända lampan med hjälp av strömbrytaren, vilken feedback ges?– Taktil, vi känner att knappen tryckts in– Hörbar, vi hör att strömbrytaren slår om– Visuell, ljuset tänds/släcks– ...

Återkoppling i gränssnitt

● Använder ofta signaler för att varna för t.ex. låg batterinivå etc.

● Blinkande fönster●

● Mobiltelefon har olika typer av signaler för olika typer av händelser

De 5 s innena

● Syn● Hörsel● Smak● Lukt● Känsel

Mest relevanta för oss

● Syn● Hörsel● Känsel

S yn

● Kroppens förmåga att upptäcka och tolka elektromagnetiska vågor i det synliga bandet (350-750 nm, ljus)

● Intesiteten, antal fotoner● Färg, fotonernas frekvens (våglängd)

S yn

● Sinne med störst bandbredd● ”En bild säger mer än 1000 ord”● Approx. bandbredd för näthinnan 9 Mbit/s● Väldigt fokuserat område, inga ögon i nacken

Hörsel

● Kroppens förmåga att uppfatta och tolka tryckförändringar i det omslutande mediet (luft, vatten, etc)

● Tryckförändringar uppfattas av trummhinnan● Extremt höga samt låga frekvenser uppfattas

också i viss mån av det taktila sensorsystemet

Hörsel

● 360 grader● Indirekt, behöver inte fokusera på ljudet för att

uppfatta det● Dock bara ta upp direkt infomation från ett ljud i

taget

Känsel

● Taktil återkoppling, uppfattas av känselceller t.ex. i fingertopparna

● Haptisk återkoppling, uppfattas av muskler och leder

Relevanta typer av återkoppling

● Visuell● Hörbar● Haptisk

Visuell återkoppling

● Informerar användaren om händelser● Timglaset● Pop-Up rutor● Progress bar● Nytt meddelande på mobilen visas ofta som ett

litet brev● Kräver att vi tittar på displayen

Hörbar återkoppling

● Typer– Literell, Realistisk– Abstrakt– Metafor– Kvitteringsljud

Literära ljud

● Ljud som efterliknar den verkliga händelsen– Explosion– Billjud, gas, broms, däckskrik– Pappersprassel då papperskorgen töms

● Lätt att applicera som effekter till ett spel men svårt att applicera på ett användargränssnitt

Abstrakta ljud

● Så kallade ”Earcons”● Utvecklat delvis för synskadade● Bygger på melodiska inslag● Begränsat antal toner● Rytm, pulser, slingor● Kallas ofta musikaliskt gränssnitt

Metaforiska ljud

● Ljud som försöker beskriva händelsen med en liknelse

● Exempel: Skrollist eller slider– Pitchen (frekvensen) på ljudet återspeglar positionen– Hög frekvens långt upp– Låg frekvens långt ner

Aktions- eller kvitterings ljud

● Typ av ljud som ofta förknippas med kvittering av att något händer– Knapptryckning, minimera fönster, avsluta datorn etc.

● Både medvetet designade eller på grund av kontruktion– Ex. planerade ljud knappljudet (”pipen”) på mobiler– Ex. oplanerade ljud, elektroniska lås som ”klickar” när

de låses upp

Haptisk återkoppling

● Används ofta i spelkotroller genom vibration● Mer avancerade rattar och joysticks i form av

”Force-feedback”● Mer avancerad hårdvara som t.ex. SensAble

Phantom

Vibration

● Visat sig mycket viktig för telefoner med touchscreen, ger kvittens på att något klickats på

● Tillgänglig i mobiltelefonen via Java● Enkel och okomplex men ändå effektfull● Varieras genom att t.ex. ändra längden på

vibrationen eller att pulsa den samma

S ummering

● Mobiltelefonens fysiska egenskaper– Visuella återkoppling

● Skärm

– Hörbar återkoppling● Högtalare

– Haptisk återkoppling● Vibrator

S ummering

● Hörbar återkoppling– Förstärker det visuella– Obegränsat med variationer (toner, ljudspår, effekter,

etc.)● Haptisk återkoppling

– Förstärker upplevelsen– Inte lika dynamisk som ljud men det räcker