Pervasive Computing
Ubiquitous Computing
APP BASICS:
TYPES AND EFFECTS
Underlying Computing laws for the Internet of things
Mobile Computing vs. Desktop Computing
Mobile Computing, Mobile Computers are…
Mobile Computing: Classes of applications
Intimate Computing
Potential Tasks
Intimate Computing: Memory Problems
Possibilities of Mobile Devices
Memory Model
Quantified Self, Life Logging
Categories
Quantified Self vs. Gamification
Ways for supporting cognitive processing
Proactive Computing & human memory support
Proactive Computing: MemoClip “Cognitive Unloading”
When writing your App
target domain
senses
memory
Summary Grundlagen
Recognized Usability experts
DESIGN AND PROGRAMMING
iOS OS-Stack
NeXT Foundation Framework
Interface Design: Widgets
Mobile app development
Difference between mobile and non-mobile apps
Categories of App Creation Tools
Classification of Mobile App Creation Tools I
Flutter System Architecture
Progressive Web Apps (PWA) – „native“ Web-Apps
Software Engineering for Mobile applications
Properties
Modern Software Development Methods
Development: Waterfall vs. Agile
The Scrum Development Process
Agile method principles/process
ANALYSIS: User Stories
Design Methods: Feature Card (for Mobile Computing)
Design: User Interface
SE Process (Development)
Why User Interface / Software Co-Design
Design: Architecture
Information Architecture vs Wireframes
Information Architecture
Architecture Sketches Requirements
Basic System Model
Typical Architectural Elements
Some Architecture Proposal
TESTING
Software Engineering Issues: Checklist
Human Computer Interaction
Usability vs User Experience
Chunks
Smartphones: More technical characteristics
Mobile Device vs. PC
Golden Ratio
Holding vs. Performance
Single handed use vs. both handed use
Input variations
Visual sense
Blur effect
Usage of Icons and Colors
Forms of usability studies
Low Fidelity Prototypes
Revised version (2014) of Nielsen’s original heuristics
Heuristics can be used to do standard checks for usability:
Usability through Guidelines
Android User Interface
Concept: Structure
Maximum of Columns
Android User Interface – Themes
General HCI: Skeleton: Wireframes
Android User Interface – Common Layouts and Views
Logical Pixels
Typography and Text
Mobile Web-Pages
Was soll getan werden um mit dem kleineren Platz haushalterischer umzugehen:
(3. -> Fettfinger problem)
Web and organizational structure
Viele Informationen (& Design) in kleine Häppchen aufteilen, dann Baum aufbauen (Hierarchie bei 1) -> Informationen gliedern
How to adopt pages for mobile computing
Adaption Server-Side
(Provider/Transcoder doesn’t really work nowadays because it doesn’t support https)
Device characteristics can be accessed using the User Agent String
Dealing with device differences
()
Web adoption
-> How to adapt web pages on client side?
How to adapt web pages on client side
(Design) Engineering & Development Method
Progressive Enhancement
Man fängt mit dem kleinsten an
Design approach: Responsive Web Design (RWD)
Fluidity
Wir haben ein Grid und innerhalb dieses Grids fließen die Elemente, falls das Grid überschritten wird, wird es größer/angepasst.
Fluid Design: So lange es die breite für 3 gibt, dann machen wir 3 hin
Vorteil: Nur eine Version der Website
Nachteil: Nur eine limitierte Scala die angepasst werden kann.
Think Aloud
Practical Think Aloud
Preparing Think aloud
Interviews
Usability-Evaluation (more summative)
CSS – Cascading Stylesheet
CSS – Vorteile
CSS – Warum Kaskade?
CSS – Grundlegende Syntax
CSS – Einfache Selektoren
CSS – Pseudoklassen
CSS – Pseudoelemente
CSS – Attributselektoren
CSS – Kindselektor
CSS – Nachfahrenselektor
CSS – Nachbarselektor
Responsive Web-Design
CSS – Media Queries
CSS – Box Modell
Moderne Content Organisation
JavaScript
Prototypen
Document Object Model (DOM)
jQuery
Übliche Probleme bei der Entwicklung von Websites
Browser-definierte Styles
Zusammenfassung HTML CSS JS
Flutter - Features
Dart Language
Everything is a widget
Widget erstellen
Declarative UI
State Management
Communication
Varying requirements: mobile vs. server (stationär)
Datenbandbreite geringer im mobilen fall
Andere Art auf Information zuzugreifen (Sessionzeiten)
Untersch. Anforderung bzgl. Zeitverzögerung
Preisunterschied
Communication for IoT
Different Network Types
WAN, Wired Networks, SWPAN
HTTPS
Wir greifen etwas ab per request und bekommen eine response von dem Server per HTML Doc.
WWW
Components
Reactivity is important for usability
There are 3 main response time limits: 0.1 sec (slider reacting), 1 sec (download of web pages), 10 sec (how long ppl can stay in the flow of the interaction)
-> once response time is slower than 1 sec, users hesitate and leave sites much more sooner.
AJAX Web Application Model
Idee: Entkoppeln -> können evtl vorläufige Antwort geben, sind nicht blockiert und können zwischendrin noch was machen
XMLHttpRequest
Network problems uncovered: Delay, Jitter, Latency
(Motivationsfolie)
TCP congestion control
TCP and mobile networks
Idee: Wir wollen überlast vermeiden und schauen wie lange ein Paket unterwegs ist. Um das Netz stabil zu halten soll diese Überlast reduziert werden.
Idee: So schnell kommunizieren wie es geht, aber ohne dass Netz zusammenbricht
Software engineering for mobile networked apps
Probelms/Handling
PAN RADIO FREQUENCY (RF)
Personal Area Networks
Netze die kleineren Raum umspannen (bspw. Bluetooth)
Following Myths are false, e.g. interference area is wider than reception area.
Sensor Networks - Common Problems!
- Solutions!
Hidden terminal: 3 kommunikationspartner, 2 können sich hören aber 1 kann nich hören, der behindert dann die anderen
RTS/CTS Ready to send, Clear to send
MAC RF networks
Bluetooth mobile communication
Main purpose
Bluetooth architecture
Datenstrang und Audio getrennt
Bluetooth Service/Profiles
SDP
Bluetooth Pairing and Security
Bluetooth - Physical layer
Recht robus dank Gaussian frequency shift key
Frequency Hopping sorgt dafür dass Störungen nicht die ganze Zeit auftritt
Bluetooth - Master and Slave
Inquiry to connect
Bluetooth - Connection: Baseband and Link layer
Baseband verwaltet Verbindungen, Link Manager: cell management
Network topology
Synchronization and addressing
Unverbundenen Zustand links, verbundener Zustand rechts (also IDs bekommen)
Links kann nicht mitspielen da sie den seed nicht haben -> hopping sequence nicht ausrechenbar -> nicht mitspielen
Baseband State transition
Range and Classes
Comparison BT TR/EDR and BLE
(Bluetooth low energy)
im groben wichtig zu wissen: reaktiv, keine audio, wenig bandbreite benötigt
BLE/Bluetooth 4.0
Advertisement = “ein Hallo senden” = inquiry
Senden über advertisement beacons oder
Differences BLE to classical BT
Roles
Link Layer State Diagram BLE for both Peripheral & Central
Einfaches protokoll, verbraucht wenig Ressourcen.
Wenn verbunden dann entstehen Rollen: GATT Client GATT Server
BLE connection establishment
BLE Beacon Packet
typischer aufbau eines datensparenden pakets
Two Views on the same devices
Link Layer vs GATT view
White List
ATT protocol
Generic ATTribute profile (GATT)
ZigBee
ZigBee vs Bluetooth vs Wifi
Physical Layer
Super Frame Structure
GTS Allocation management
Gut gegen overhearing
2 Teile: Superframe Struktur wird über master über beacon festgelegt. Graue Bereich wird nicht benutzt, alle sind inaktiv (Energiesparsam). Im weißen Bereich wird gesendet. Der CAP (Contention Access Period) Teil (vorne) ist für jeden frei zu senden, in CFP (Contention Free Period) bekommt man slots zugewiesen vom Master falls man braucht (GTS Allocation).
IEEE MAC (media access controll): Features
IEEE Addressing, Beacons
MAC Frame Overview
ZigBee topology
Matter
Eigentlich unwichtig, wissen dass es existiert. Kann funktionieren, aber wird nich benutzt. Soll interoperability improven und operiert in höheren Layern als bspw. Zigbee. “Just don’t do it. Jo kann man machen aber braucht man das alles?”
LoRa: Long Range Wireless Communication Standard
LoRa Stack
Für Telemetrie gedacht (Abfrage von sich selten änderneden Werten wie bspw. Wasserstand/-höhe, Temperatur)
LoRa Range and Bitrate
LoRa Restrictions
MAC: LoRa Devices
LoRa structure
LoRa WAN
Principle Communication Structures
Universal Plug and Play (UPnP)
(IOT MULTIMEDIA)
DLNA
UPnP Media Devices
DLNA 2-Box Models
3-Box Model
Two Basic Principles In IoT Middleware
& some IoT protocols
Service Principle of IoT
The Service Federation Triangle
Message Broker Definition
IoT:
REST - Representational State Transfer
W3C Web Services
Service Orientation: OPC/UA
Message Oriented Middleware (MOM)
Message Queue Telemetrie Transport
Constrained Application Protocol (CoAP)
Resource Observing
Gastvorlesung AWS
Here’s a recap of the session.
I presented you AWS Amplify (https://docs.amplify.aws/): a set of tools and services to accelerate the development of mobile and web applications on AWS.
Amplify includes an opensource framework of libraries, UI components, CLI, and a graphic environment (Amplify Studio) to build the application backend and integrate it with web and mobile applications (iOS, Android and React Native).
Amplify makes it easy to create the AWS resources needed for the application, including Amazon Cognito.
Amplify creates resources in the linked AWS account and it sets the correctend points with a JSON config file. All services are visible and configurable even outside Amplify, and it is possible to import existing resources.
Amplify libraries, CLI, and console interface are free and you only pay for hosting and for the AWS services that are created when you add the feature, for example for the Cognito user pool that is created to authenticate users. Amplify Studio also provides integration with Figma to generate React code starting from the design on Figma. In this case, Amplify automatically converts Figma components into React components.
Bosch VL
Microelectromechanical systems (MEMS)
Why MEMS -> Cost, Size&Weight, Reliability
Wo? Im Auto, beim Gaming, Healthcare
Zuletzt geändertvor 5 Monaten
