Guess The Hidden Number
Στο παρακάτω παραδειγμα ο χρήστης έχει τη δυνατότητα να μαντέψει το κρυμμένο αριθμό. Εμφανίζονται τρεις κάρτες με αριθμούς, εκ των οποίων η μια ειναι κρυφή. ...
Ευρετήριο
- HCI 39
- Apple 37
- Alan Kay 22
- Xerox PARC 21
- IV 19
- success 19
- Macintosh 18
- Microsoft 16
- Bill Atkinson 15
- Douglas Engelbart 15
- NLS 15
- Smalltalk 14
- Ποντίκι 14
- Dynabook 11
- Ux 11
- User Experience 11
- Εμπειρία Χρήστη 11
- Ux History 11
- UNIX 11
- mouse 10
- MacPaint 10
- iPhone 10
- BASIC 10
- Τηλέτυπος 10
- Ivan Sutherland 9
- Alto 9
- Xerox Alto 8
- Altair 8
- Πληκτρολόγιο 8
- Jaron Lanier 7
- Atari 7
- Sketchpad 7
- Ted Nelson 7
- Spacewar 7
- Xerox Star 7
- Τερματικό 7
- menu 6
- Hypercard 6
- Arduino 6
- Εξομοιωτής Τερματικού 6
- Superpaint 6
- Διδακτορικό 6
- MIT Lincoln 6
- Windows 6
- Don Norman 5
- Canon Cat 5
- Larry Tesler 5
- Touch 5
- History 5
- Tactile 5
- Haptics 5
- ατμοσφαιρική ρύπανση 5
- Raspberry Pi 5
- Wikipedia 5
- X-Windows 5
- Jef Raskin 5
- Liza 5
- Facebook 5
- VPL 5
- DEC 5
- Παγκόσμιος Ιστός 5
- WYSIWYG 5
- Επεξεργασία Εικόνας 5
- Nova 5
- Steve Jobs 4
- Bret Victor 4
- HTML 4
- CSS 4
- Javascript 4
- button 4
- programming 4
- image 4
- Magic Cap 4
- Augmented Reality 4
- LINC 4
- Apple I 4
- Apple II 4
- Lisa 4
- Logo 4
- Γραμμή Εντολών 4
- Pong 4
- Πληκτρολόγιο Ακόρντων 4
- MSDOS 4
- CPM 4
- tablet 4
- laptop 4
- vim 4
- IBM 4
- iPod 4
- DataGlove 4
- MIT 4
- Τηλεδιάσκεψη 4
- Xanadu 4
- Star 4
- Εικονίδια 4
- Tab 4
- Board 4
- Xerox Bravo 4
- scroll 3
- video 3
- visualization 3
- Sword of Damocles 3
- Virtual Reality 3
- Google Glass 3
- AR 3
- VR 3
- GUI 3
- WWW 3
- αισθητήρες 3
- Bell Labs 3
- Oberon 3
- Biology 3
- Ecology 3
- Earth Science 3
- Geography 3
- Συναρμολογούμενο 3
- One-button 3
- VNC 3
- tmux 3
- Breakout 3
- Lunar Lander 3
- Commodore PET 3
- WordStar 3
- Damocles Sword 3
- Tablet 3
- IDE 3
- Πένα 3
- Google 3
- iTV 3
- Pebble 3
- Minecraft 3
- Παραθυρικό Περιβάλλον 3
- Niklaus Wirth 3
- PDP 3
- Reactable 3
- history 2
- invention 2
- technology 2
- Knuth 2
- Myron Krueger 2
- picasso 2
- Arithmology 2
- Visualization 2
- Game 2
- Form 2
- Server Render HTML 2
- camera 2
- motion 2
- css 2
- animation 2
- input 2
- form 2
- google 2
- map 2
- General Magic 2
- iPad 2
- Gypsy 2
- Amiga 2
- Linux 2
- Bill English 2
- educational 2
- Ατμοσφαιρική Ρύπανση 2
- Τοποθεσία χρήστη 2
- Plan9 2
- Sam 2
- Amaya 2
- Ivan Shutherland 2
- Apple Newton 2
- Έξυπνο Ρολόϊ 2
- Swyftware 2
- Processing 2
- Ολοκληρωμένο Περιβάλλον Ανάπτυξης 2
- MIT Media Lab 2
- Dataland 2
- Space Invaders 2
- Adventure 2
- Apple Lisa 2
- Προγραμματισμός 2
- Cedar 2
- Air Quality 2
- Μικροϋπολογιστές 2
- Bill Gates 2
- dynabook 2
- editor 2
- PDA 2
- RAND 2
- Github 2
- Rand 2
- GRAIL 2
- Έξυπνο κινητό 2
- BBC micro 2
- Desktop 2
- Newton 2
- Kinect 2
- Φωτογραφία 2
- Έξυπνο ρολόϊ 2
- IBM PC 2
- Seymour Papert 2
- Scratch 2
- Έξυπνο Κινητό 2
- MAX-MSP 2
- Apple 2 2
- multimodal 2
- Υπόδειγμα 2
- Χαμηλή Πιστότητα 2
- Σχεδιάγραμμα 2
- OLPC 2
- PLATO 2
- Apple2 2
- TX-2 2
- Steve Mann 2
- NASA 2
- Pad 2
- PARC 2
- Τερματικό Κειμένου 2
- Tiled Windows 2
- Stacked Windows 2
- DEC PDP 2
- Xerox 2
- Xerox Gypsy 2
- Liveboard 2
- activity tracker 1
- Quantified Self 1
- collaborative system 1
- media player 1
- mobile notes 1
- Photography 1
- tv remote 1
- video game 1
- Aristotle 1
- Grady Booch 1
- Bill Buxton 1
- Auguste Comte 1
- culture 1
- Confucius 1
- Freeman Dyson 1
- Albert Einstein 1
- Odysseas Elytis 1
- Antoine de Saint-Exupery 1
- Feynman 1
- Thomas C. Gale 1
- Jesse James Garrett 1
- C.A.R. Hoare 1
- John Holt 1
- computer science 1
- generation 1
- medium 1
- J. C. R. Licklider 1
- Marshall McLuhan 1
- Marvin Minsky 1
- Ken Olsen 1
- Paul Rand 1
- Scott Rosenberg 1
- Bjarne Stroustrup 1
- graphics 1
- Thomas J Watson 1
- Mark Weiser 1
- 3D 1
- Charts 1
- palindrome 1
- Entertainment 1
- todolist 1
- calculator 1
- color 1
- queries 1
- WEB 1
- javascript 1
- quotes 1
- sequence 1
- database 1
- UX 1
- google-charts 1
- 3d 1
- filter 1
- zoom 1
- text 1
- keyboard 1
- location 1
- dropdown 1
- empty 1
- pie 1
- slide 1
- draw 1
- eraser 1
- option 1
- bar 1
- Password 1
- Vou js 1
- html 1
- sortable 1
- list 1
- dataset 1
- Weather 1
- Calendar 1
- noble 1
- olsen 1
- thimbleby 1
- PhotoCard 1
- Drop-down menu 1
- Double click 1
- Brenda Laurel 1
- ποντίκι 1
- Επαυξημένη Νοημοσύνη 1
- SwyftCard 1
- Υπερμέσα 1
- Samsung 1
- Virtual dives 1
- affective usability 1
- measuring air quality 1
- application 1
- Amazon 1
- Alexa 1
- AlterEgo 1
- EMG 1
- Silent speech Interface 1
- Human-Machine symbiosis 1
- xerox alto 1
- arduino 1
- Augmented & Virtual Reality 1
- Κονσόλες 1
- Interactive 3D content using a visual programming language 1
- Simulations 1
- education 1
- facebok 1
- Microsoft Hololens 1
- apple 1
- ipod 1
- Macintosh Portable 1
- Microbit 1
- moding 1
- making 1
- minecraft 1
- Marc Weiser 1
- donald norman 1
- reactable 1
- Rezzil 1
- AV 1
- Immersive Experience 1
- raspberry 1
- xerox star 1
- air Quality 1
- simulator 1
- 3D disign 1
- unix 1
- vocsensor 1
- wikipedia 1
- Microsoft windows 1
- Tim Berners Lee 1
- WICKED DEVICE LLC 1
- Οικιακός υπολογιστής 1
- Motorola 68000 1
- Commodore 128 1
- ποιότητα αέρα 1
- Education 1
- Χάρτης 1
- Tisch Environmental Inc. 1
- Ακόρντα 1
- Olivetti 1
- Microsoft Research 1
- Βιντεοπαιχνίδια περιπέτειας 1
- Ancient Greeks 1
- Αρχαίοι Έλληνες 1
- Android 1
- SDK 1
- Windows95 1
- Lilypad 1
- ARM 1
- Google Maps 1
- Atari 2600 1
- Easter Egg 1
- Apple Paint 1
- Ευχρηστία 1
- BBC 1
- BBS 1
- Gordon Bell 1
- Mesa 1
- Steve Wosniak 1
- buck 1
- Commodore 1
- Demoscene 1
- CAD 1
- Επεξεργαστής Κειμένου 1
- SwyftWare 1
- Διάτρητη κάρτα 1
- Charachorder 1
- Chat bot 1
- Colemak 1
- Space War 1
- BIOS 1
- Gary Kildall 1
- PLM 1
- Aspen Movie Map 1
- Industrial Designer 1
- Henry Dreyfuss 1
- Usability improvements 1
- Walt Disney 1
- The Design of Everyday Things 1
- Dvorak 1
- Laptop 1
- Επεξεργασία φυσικής γλώσσας 1
- emacs 1
- Eclipse 1
- Γραφικό Περιβάλλον 1
- Εngelbart 1
- ease of use 1
- High Performance 1
- knowledge workers 1
- dougengelbart.org 1
- Simon 1
- Bell South 1
- Personal Digital Assistant 1
- personal digital assistant 1
- PSION 1
- John Sculley 1
- POS 1
- point of sale 1
- Εργονομία 1
- Μοντελοποίηση 1
- Fitts 1
- DRI 1
- Γραφικά Κίνησης 1
- Genesys 1
- Προσομοίωση 1
- Εξομοίωση 1
- Γεωγραφική θέση 1
- Αναζήτηση 1
- Assistant 1
- AI 1
- JOSS 1
- Feng shui 1
- hackathon 1
- AMADEUS 1
- CRS 1
- Basic 1
- App 1
- Υπολογιστής 1
- Hypertalk 1
- Σημειώσεις 1
- Keyboard 1
- PC 1
- David Smith 1
- Tom Igoe 1
- Διδασκαλία 1
- touch screen 1
- IRC 1
- winky dink and you 1
- Squeak 1
- Έξυπνο ρολόι 1
- KidSim 1
- Videoplace 1
- Donald Knuth 1
- Fonts 1
- Documents 1
- Kodak 1
- Intel 1
- Modula 1
- Εκτυπωτής Γραμμής 1
- Τέχνη ASCII 1
- GNU 1
- Ρομπότ 1
- Paul Allen 1
- Makerspace 1
- Hackerspace 1
- Plato 1
- Μουσική 1
- Οθόνη αφής 1
- Media Space 1
- Κοινωνικά Δίκτυα 1
- Menu 1
- Ubuntu Unity 1
- Windows 95 1
- Minitel 1
- Teletel 1
- Internet 1
- Media Lab 1
- Μικτή Πραγματικότητα 1
- mockup 1
- Myst 1
- Napster 1
- peer-to-peer 1
- Πολυτροπική Επικοινωνία 1
- Διάλογος 1
- deictic pointing gestures 1
- human-computer dialogues 1
- Multi-Media Interface Project 1
- Super Mario Bros 1
- The Legend of Zelda 1
- Metroid 1
- Nintendo Entertainment System 1
- Cartridge 1
- Bravo 1
- Nomodes 1
- Διαχειριστής Αρχείων 1
- Υπενθυμίσεις 1
- Lilith 1
- Modula2 1
- Γραφική Διεπαφή 1
- Oculus Rift 1
- Εικονική πραγματικότητα 1
- Headset 1
- Open Street Map 1
- Xerox Note Taker 1
- VisiCalc 1
- Εφαρμογές 1
- Διάτρητη ταινία 1
- οθόνη αφής 1
- Gran Turismo 1
- Wipeout 1
- Crash Bandicoot 1
- Spyro 1
- Tomb Raider 1
- Resident Evil 1
- Metal Gear 1
- Tekken 1
- Final Fantasy 1
- Playstation 1
- CD-Rom 1
- Tennis for Two 1
- Rotoscoping 1
- Nintento 1
- Probes 1
- pen 1
- BBC Micro 1
- IoT 1
- Ανθρωπομορφισμός 1
- Rob Pike 1
- Acme 1
- Second Life 1
- Skype 1
- Γραμματοσειρές 1
- Ηλεκτρονικό Εμπόριο 1
- Gamepad 1
- PDP1 1
- star7 1
- sun microsystems 1
- prototype 1
- pda 1
- portable 1
- touchscreen 1
- metaphor 1
- Sun Starfire 1
- Apple Knowledge Navigator 1
- Βίντεο 1
- SugarOS 1
- collaboration 1
- Dick Shoup 1
- Αυτοπορτραίτο 1
- AppleII 1
- Μπάλα κύλισης 1
- Telepresence 1
- Media spaces 1
- Τηλεόραση 1
- Teletext 1
- Κέλυφος Εντολών 1
- Βιντεοπαιχνίδι 1
- Εργαλειοθήκη 1
- Touch Develop 1
- Touchpad 1
- Αφή 1
- Toyota 1
- Sakichi Toyoda 1
- Usability testing 1
- Τροχός Κύλισης 1
- Κινητό 1
- Τρανζιστοράκι 1
- Model 33 1
- shell 1
- Bootstraping 1
- LISP 1
- UNREAL 1
- Visicalc 1
- Φύλλο Εργασίας 1
- Remote Frame Buffer 1
- EyePhone 1
- VT100 1
- Craigslist 1
- Wikimedia 1
- MP3 1
- skins 1
- Windows Mobile 1
- Windows Phone 1
- Κουμπί Εκκίνησης 1
- Μενού Εκκίνησης 1
- Frederick Winslow Taylor 1
- Taylorism 1
- Scientific Management 1
- LaTeX 1
- Mockup 1
- ZigZag 1
- Lary Tesler 1
- Xerox Mesa 1
- Dorado 1
- Portholes 1
- Spatial Dataland 1
- Pad++ 1
- Archy 1
HCI
Interactive Charts with Chart.js
Το παρακάτω παράδειγμα δημιουργεί διαδραστικά γραφήματα χρησιμοποιώντας τη βιβλιοθήκη Chart.js. Τα γραφήματα εμφανίζουν δεδομένα με διάφορες οπτικοποιήσεις, ...
Interactive Product Catalog with Form Submission
Αυτό το διαδραστικό παράδειγμα κώδικα παρουσιάζει έναν κατάλογο προϊόντων που επιτρέπει στους χρήστες να προσθέτουν νέα προϊόντα μέσω μιας φόρμας. Τα προϊόντ...
Palindrome Checker
Καρκινικές επιγραφές ή καρκίνοι ονομάζονται συμμετρικές φράσεις οι οποίες μπορούν να διαβαστούν το ίδιο είτε από την αρχή είτε από το τέλος.Για την λόγο αυτό...
Take a Wish!
Στο παρακάτω παραδειγμα ο χρήστης μπορεί να πατήσει το κουμπί απο εναν αριθμό και να εμφανιστεί μια ευχή. Ο χρήστης μπορεί να πατήσει όσα κουμπιά θέλει, όσες...
TodoList
Μια λίστα υποχρεώσεων είναι μια λίστα στοιχείων που πρέπει να συμπληρωθούν. Τα στοιχεία της λίστας μπορεί να κυμαίνονται από απλές δραστηριότητες, όπως απάντ...
Button
Διαδραστικό παράδειγμα κώδικα που δημιουργεί ένα κουμπί που εκτελεί διαφορετικές λειτουργίες κατά το Hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκ...
Calculator
Παράδειγμα οπτικής και λειτουργικής εξομοίωσης αριθμομηχανής.
Programmable WEB interactivity
Generic pαράδειγμα διαδραστικού κώδικα που χρησιμοποιεί javascript με ελάχιστη HTML και χρησιμοποιεί τις ιδιότητες του DOM (Document Object Model) και του CS...
Famous Quotes
Αυτό το διαδραστικό παράδειγμα κώδικα δημιουργεί μια απλή εφαρμογή για τυχαία αποφθέγματα. Με κάθε κλικ πάνω στο κουμπί new quote φορτώνει ένα καινούργιο τυχ...
Fibonacci
Διαδραστικό παράδειγμα κώδικα για το αν ένας αριθμός είναι Fibonacci ( https://en.wikipedia.org/wiki/Fibonacci_sequence ). Ο χρήστης εισάγει τον αριθμό μέσω ...
Firebase form
Η φόρμα χρησιμοποιεί την δικτυακή βάση δεδομένων firebase.
Animate with mouse slider
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή ελέγχου της κίνησης αντικειμένου on screen. Η κύλιση του χειριστιρίου του slider δίνει ...
Form validation
Το παράδειγμα αυτό βασίζεται σε regular expression για να εντοπίσει σφάλματα στην είσοδου του χρήστη.
Image processing
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
Image zoom
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
Image
Διαδραστικό παράδειγμα κώδικα που εισάγει μια εικόνα τύπου SVG (https://en.wikipedia.org/wiki/Scalable_Vector_Graphics). Όταν εκτελείται από το χρήστη η λειτ...
Interactive Text
Διαδραστικό παράδειγμα κώδικα που δημιουργεί ειδικά εφέ κατά το Hover (κίνηση του ποντικιού πάνω από την εικόνα) πάνω στο κείμενο. Για τη δημιουργία αυτών τω...
Keyboard input
Μετακίνηση αντικειμένου μέσω πληκτρολογίου (html Canvas)
Maps location
Εύρεση τοποθεσίας μέσω της χρήσης φόρμας εισόδου και του Google Maps API (https://developers.google.com/maps/?hl=en).
Menu CSS
Παράδειγμα εναλλακτικού μενού χωρίς τη χρήση Javascript. Για τη δημιουργία της διάδρασης έχει χρησιμοποιηθεί ο CSS preprocessor SCSS.
Menu dropdown
Διαδραστικό παράδειγμα dropdown μενού χωρίς τη χρήση Javascript.
Menu empty
Παράδειγμα εναλλακτικού μενού χωρίς ενσωματωμένες λειτουργίες.
Menu pie
Διαδραστικό παράδειγμα πολύπλοκου κυκλικού μενού. Με την επιλογή του κουμπιού “open” από το χρήστη, εμφανίζονται μια σειρά από πιθανές επιλογές.
Menu scroll
Διαδραστικό παράδειγμα responsive μενού σε One page template χρησιμοποιώντας τη βιβιοθήκη Τwitter Βootstrap 3.0 . Στο παράδειγμα εμφανίζεται το μενού έπειτα ...
Menu slide
Παράδειγμα slide μενού χωρίς ενσωματωμένες λειτουργίες.
Mouse button
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, πατώντας το κουμπί “ANOTHER” μπορεί να αλλάξει τα εκτυπωμένα μηνύματα.
Mouse eraser
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως “σβηστήρι”. Υπάρχουν δύο διαθέσιμες εικόνες και η μία σβήνει μετακινώντας τον κέρσορα για να απ...
Mouse form
Παράδειγμα εισόδου μέσω της συσκευής Ποντίκι Νο.4
Mouse option
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, μπορεί να αλλάξει δυναμικά το περιεχόμενο που θα εμφανίζεται στη σελίδα. Για το σκο...
Mouse scroll
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου και δίνει ως έξοδο το ανάλογο αποτέλεσμα στην οθόνη. Για να αλλάξει η τιμή εισό...
Nav Bar
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, μπορεί να κάνει κλικ σε κάθε μία από τις επιλογές της navigation bar.
Plyr video player
Το βίντεο χρησιμοποιεί για τον έλεγχο το σύστημα αναπαραγωγής της βιβλιοθήκης Plyr.
Random Password Generator
Αυτό το διαδραστικό παράδειγμα κώδικα δημιουργεί μια εφαρμογή για τη δημιουργία κωδικών πρόσβασης για το χρήστη. Ο χρήστης μπορεί να επιλέξει το μέγεθος του ...
Sortable list
Παράδειγμα διαδραστικού κώδικα που ταξινομεί μια λίστα με τη χρήση του ποντικιού. Χρησιμοποιείται το στοιχείο sortable της JavaScript βιβλιοθήκης JQueryUI (...
Switch
Διαδραστικό παράδειγμα κώδικα που αναπαριστά τη λειτουργία ενός διακόπτη. Ο χρήστης μπορεί να επιλέξει ανάμεσα στις επιλογές ON και OFF. Για τη δημιουργία το...
Weather API
Αυτό το διαδραστικό παράδειγμα κώδικα δημιουργεί μια εφαρμογή για την ανάγνωση των καιρικών συνθηκών σε μια πόλη. Ο χρήστης πληκτρολογώντας το όνομα της πόλη...
YouTube video player
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου. Το βίντεο χρησιμοποιεί για την έναρξη και την παύση του το σύστημα αναπαραγωγή...
Ιnteractive calendar with reminders
Αυτό το έργο είναι ένα διαδραστικό ημερολόγιο με λειτουργικότητα υπενθυμίσεων. Οι χρήστες μπορούν να προσθέσουν υπενθυμίσεις για συγκεκριμένες ημερομηνίες ει...
Apple
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Alan Kay
Alan Kay
Από πολύ μικρή ηλικία ο Alan Kay έχει παρουσιάσει σημαντικά ταλέντα, όπως ανάγνωση πριν πάει στο δημοτικό, με αποτέλεσμα να βαριέται στην τάξη, αφού ήδη γνώρ...
Xerox PARC
Το ερευνητικό κέντρο της Xerox με την ονομασία PARC (Palo Alto Research Center) δημιουργήθηκε το 1970 με στόχο να επενδύσει τα μεγάλα κέρδη που είχε η μητρικ...
Xerox PARC
Xerox PARC
Το ερευνητικό κέντρο της Xerox με την ονομασία PARC (Palo Alto Research Center) δημιουργήθηκε το 1970 με στόχο να επενδύσει τα μεγάλα κέρδη που είχε η μητρικ...
IV
Calculator
Παράδειγμα οπτικής και λειτουργικής εξομοίωσης αριθμομηχανής.
Camera motion color
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει ένα πλαίσιο πράσινου χρώματος . Όταν εντοπιστεί κίνηση μέσα στο πλαίσιο αλλάζει το χρώ...
Camera motion
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει δύο διαφορετικά πλαίσια (πράσινο και κόκκινο). Όταν εντοπιστεί κίνηση σε κάποιο πλαίσι...
CSS queries
Παράδειγμα κώδικα με σκοπό να γίνει κατανοητή η χρήση των CSS media queries. Αλλάζοντας το μέγεθος του παραθύρου του περιηγητή (browser) σας αλλάζει το χρώμα...
Firebase form
Η φόρμα χρησιμοποιεί την δικτυακή βάση δεδομένων firebase.
Google Charts Visualization
Παράδειγμα που παρουσιάζει το πληθυσμό και GDP Κύπρου και Ελλάδας. Το γράφημα αλλάζει μέσω ενός dropdown menu.
Google maps
Έυρεση τοποθεσίας χρήστη χρησιμοποιώντας το Google Maps API (https://developers.google.com/maps/?hl=en).
3D image
Διαδραστικό παράδειγμα εικόνων χρησιμοποιώντας την τεχνική parallax. Στο συγκεκριμένο παράδειγμα η τεχνική αυτή δημιουργεί την αίσθηση του 3d περιβαλλντος. Ο...
Image processing
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
Image zoom
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
Image
Διαδραστικό παράδειγμα κώδικα που εισάγει μια εικόνα τύπου SVG (https://en.wikipedia.org/wiki/Scalable_Vector_Graphics). Όταν εκτελείται από το χρήστη η λειτ...
Interactive Text
Διαδραστικό παράδειγμα κώδικα που δημιουργεί ειδικά εφέ κατά το Hover (κίνηση του ποντικιού πάνω από την εικόνα) πάνω στο κείμενο. Για τη δημιουργία αυτών τω...
Keyboard input
Μετακίνηση αντικειμένου μέσω πληκτρολογίου (html Canvas)
Maps location
Εύρεση τοποθεσίας μέσω της χρήσης φόρμας εισόδου και του Google Maps API (https://developers.google.com/maps/?hl=en).
Plyr video player
Το βίντεο χρησιμοποιεί για τον έλεγχο το σύστημα αναπαραγωγής της βιβλιοθήκης Plyr.
Sortable list
Παράδειγμα διαδραστικού κώδικα που ταξινομεί μια λίστα με τη χρήση του ποντικιού. Χρησιμοποιείται το στοιχείο sortable της JavaScript βιβλιοθήκης JQueryUI (...
Visualization dataset
Διαδραστικό παράδειγμα γραφήματος χρησιμοποιώντας τη βιβλιοθήκη d3.js (http://d3js.org). Το παράδειγμα οπτικοποιεί 2 διαφορετικά σετ δεδομένων (datasets).
Visualization
Παράδειγμα διαδραστικού γραφήματος No.1
YouTube video player
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου. Το βίντεο χρησιμοποιεί για την έναρξη και την παύση του το σύστημα αναπαραγωγή...
success
Σχετικά με την Amiga
Στην Commodore λοιπόν ο σχεδιασμός για το μέλλον ήταν σαφής. Χρειάζονταν ένα σύστημα που θα είχε τις δυνατότητες της Amiga 1000 παράλληλα όμως θα είχε σημαντ...
Samsung AR Demo
Η Samsung, η μεγαλύτερη και πιο αξιόπιστη μάρκα ηλεκτρονικών ειδών ευρείας κατανάλωσης, έχει επεκτείνει τις ανέπαφες προσφορές της για τους καταναλωτές με μι...
Virtual dives into the underwater archaeological treasures of South Italy
Τα εσωτερικά κίνητρα, όπως η απόλαυση και η διασκέδαση, προάγουν την εμβάθυνση της συμμετοχής και την αυξημένη επιμονή στις εκπαιδευτικές δραστηριότητες. Αυτ...
Xerox Alto
Ο προσωπικός υπολογιστής θεωρείται δεδομένος για τους χρήστες μετά την δεκαετία του 1980, αλλά ήταν μόνο μια ιδέα για πολύ λίγους ερευνητές την δεκαετία του ...
Arduino
Το Arduino είναι ένας πολύ δημοφιλής μικροελεγκτής που φτιάχτηκε με αρχικό σκοπό τον προγραμματισμό και την εκπαίδευση των φοιτητών της διάδρασης ανθρώπου κα...
Κονσόλες βιντεοπαιχνιδιών
Οι κονσόλες βιντεοπαιχνιδιών και τα βιντεοπαιχνίδια που τρέχουν σε αυτές αναπτύχθηκαν παράλληλα με τους οικιακούς μικροϋπολογιστές και έχουν ιδιαίτερη σημασί...
Education
Figure 1: Technology allows an even, level, or flat playing field for economies across the world. Once individuals have access to the world wide we...
Figure 1: Μία από τις αρχικές εκδοχές είχε διαφορετικό όνομα (thefacebook) και δεν διέφερε πολύ από ένα απλό σύστημα βάσης δεδομένων με προφίλ χρησ...
Η σχεδίαση των καθημερινών πραγμάτων
Η κατανόηση και η χρήση μιας συσκευής διέπεται από μερικές βασικές και διαχρονικές αξίες που είναι οι ίδιες ανεξάρτητα από το είδος και την πολυπλοκότητα που...
Reactable
Το Reactable είναι ένα ψηφιακό μουσικό σύστημα που βασίζεται στη διάδραση με την αφή και με απτά αντικείμενα.1 Εκτός από την εκθεσιακή του εγκατάσταση και τη...
Raspberry
Το Raspberry Pi, αποτελεί μια σειρά υπολογιστών μιας πλακέτας που αναπτύχθηκε από τον οργανισμό Raspberry Pi Foundation στο Ηνωμένο Βασίλειο ο οποίος κυκλο...
Xerox Star
Figure 1: Ο επιτραπέζιος υπολογιστής με πληκτρολόγιο, ποντίκι, και γραφική επιφάνεια εργασίας (παράθυρα, εικονίδια, φάκελοι) που δημιουργήθηκε από ...
The Egg
H Επιστήμη του Λαού ήρθε στην τάξη. Εισηχθησαν έννοιες ποιότητας αέρα σε πραγματικό πλαίσιο. Μελετώντας τη ρύπανση σε τοπικά περιβάλλοντα, οι μαθητές μαθαίνο...
Tinkercad
Εκδημοκρατισμός Σχεδιασμού και Ηλεκτρονικής για Όλους. Το Tinkercad, μια δωρεάν διαδικτυακή εφαρμογή που αναπτύχθηκε από την Autodesk, έχει φέρει επανάσταση ...
Unix
Το Unix είναι περισσότερο γνωστό σε όσους ασχολούνται με τα λειτουργικά συστήματα και σχεδόν καθόλου γνωστό στην κοινότητα της διάδρασης και των γραφικών διε...
VOC Sensor
Υπάρχουν πολλοί κίνδυνοι για την υγεία που αντιμετωπίζουμε στην καθημερινή μας ζωή. Από την οδήγηση αυτοκινήτου, την πτήση με αεροπλάνο, μέχρι το περπάτημα σ...
Wikipedia
Η συμμετοχική ανάπτυξη και η ευέλικτη διανομή και αλλαγή ενός προϊόντος για υπολογιστές ξεκίνησε με την περίπτωση του λογισμικού ανοικτού κώδικα. Όμως, η δια...
Microsoft Windows
Η επιφάνεια εργασίας του επιτραπέζιου υπολογιστή είναι ένα δημοφιλές και ευέλικτο σύστημα που πέρασε από πολλούς κύκλους ανάπτυξης και προσαρμογής, τόσο κατά...
World Wide Web
Η κατασκευή του συστήματος World Wide Web (WWW) και κυρίως η πολύ γρήγορη αποδοχή του από ένα μεγάλο εύρος χρηστών ήταν μια εξέλιξη κομβικής σημασίας για την...
Macintosh
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Jef Raskin
Ο Jef Raskin, όπως και οι περισσότεροι πρωτοπόροι των υπολογιστών, δεν σπούδασε κάτι σχετικό με την πληροφορική, ενώ παράλληλα είχε πολλά ενδιαφέροντα με κεν...
Microsoft
Bill Atkinson
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Douglas Engelbart
Douglas Engelbart
O Douglas Engelbart έγινε διάσημος για την συσκευή εισόδου ποντίκι,1 αλλά αυτό θεωρείται μόνο μια μικρή παράπλευρη εφεύρεση σε σχέση με το σύνολο της συνεισφ...
Συσκευή εισόδου ποντίκι
Αν και σήμερα η χρήση της συσκευής εισόδου ‘ποντίκι’ σε συνδυασμό με τη γραφική επιφάνεια εργασίας και τις αντίστοιχες εφαρμογές γραφείου και παραγωγικότητας...
NLS
Douglas Engelbart
O Douglas Engelbart έγινε διάσημος για την συσκευή εισόδου ποντίκι,1 αλλά αυτό θεωρείται μόνο μια μικρή παράπλευρη εφεύρεση σε σχέση με το σύνολο της συνεισφ...
Smalltalk
Alan Kay
Από πολύ μικρή ηλικία ο Alan Kay έχει παρουσιάσει σημαντικά ταλέντα, όπως ανάγνωση πριν πάει στο δημοτικό, με αποτέλεσμα να βαριέται στην τάξη, αφού ήδη γνώρ...
Larry Tesler
Ο Larry Tesler στην πρώτη προγραμματιστική δουλειά του προσπάθησε να βελτιώσει την ευχρηστία μιας διεπαφής σχεδίασης γραφικών για μεγάλες οθόνες σε στάδια πο...
Ποντίκι
Συσκευή εισόδου ποντίκι
Αν και σήμερα η χρήση της συσκευής εισόδου ‘ποντίκι’ σε συνδυασμό με τη γραφική επιφάνεια εργασίας και τις αντίστοιχες εφαρμογές γραφείου και παραγωγικότητας...
Dynabook
Alan Kay
Από πολύ μικρή ηλικία ο Alan Kay έχει παρουσιάσει σημαντικά ταλέντα, όπως ανάγνωση πριν πάει στο δημοτικό, με αποτέλεσμα να βαριέται στην τάξη, αφού ήδη γνώρ...
Ux
User Experience
Εμπειρία Χρήστη
Ux History
UNIX
mouse
Animate with mouse slider
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή ελέγχου της κίνησης αντικειμένου on screen. Η κύλιση του χειριστιρίου του slider δίνει ...
Mouse button
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, πατώντας το κουμπί “ANOTHER” μπορεί να αλλάξει τα εκτυπωμένα μηνύματα.
Mouse draw
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου. Ο χρήστης μπορεί να χρησιμοποιήσει το ποντίκι για να σχεδιάσει στη λευκή επιφά...
Mouse eraser
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως “σβηστήρι”. Υπάρχουν δύο διαθέσιμες εικόνες και η μία σβήνει μετακινώντας τον κέρσορα για να απ...
Mouse form
Παράδειγμα εισόδου μέσω της συσκευής Ποντίκι Νο.4
Mouse option
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, μπορεί να αλλάξει δυναμικά το περιεχόμενο που θα εμφανίζεται στη σελίδα. Για το σκο...
Mouse scroll
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου και δίνει ως έξοδο το ανάλογο αποτέλεσμα στην οθόνη. Για να αλλάξει η τιμή εισό...
Nav Bar
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, μπορεί να κάνει κλικ σε κάθε μία από τις επιλογές της navigation bar.
Sortable list
Παράδειγμα διαδραστικού κώδικα που ταξινομεί μια λίστα με τη χρήση του ποντικιού. Χρησιμοποιείται το στοιχείο sortable της JavaScript βιβλιοθήκης JQueryUI (...
MacPaint
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
iPhone
BASIC
Τηλέτυπος
Ivan Sutherland
Alan Kay
Από πολύ μικρή ηλικία ο Alan Kay έχει παρουσιάσει σημαντικά ταλέντα, όπως ανάγνωση πριν πάει στο δημοτικό, με αποτέλεσμα να βαριέται στην τάξη, αφού ήδη γνώρ...
Ivan Sutherland
Ο Ivan Sutherland μεγάλωσε παίζοντας μια γερμανική εκδοχή των Lego, όπου ένα μικρό σετ από γεωμετρικά σχήματα μπορεί να δώσει μορφή σε πολύπλοκες κατασκευές ...
Alto
Xerox Alto
Alan Kay
Από πολύ μικρή ηλικία ο Alan Kay έχει παρουσιάσει σημαντικά ταλέντα, όπως ανάγνωση πριν πάει στο δημοτικό, με αποτέλεσμα να βαριέται στην τάξη, αφού ήδη γνώρ...
Altair
Πληκτρολόγιο
Jaron Lanier
Jaron Lanier
Ο Jaron Lanier έγινε ευρύτερα γνωστός για τον προβληματισμό σχετικά με τα κοινωνικά μέσα και τους μηχανισμούς εξατομίκευσης που χρησιμοποιούν. Ηταν ήδη όμως ...
Atari
Back to Top ↑Sketchpad
Ivan Sutherland
Ο Ivan Sutherland μεγάλωσε παίζοντας μια γερμανική εκδοχή των Lego, όπου ένα μικρό σετ από γεωμετρικά σχήματα μπορεί να δώσει μορφή σε πολύπλοκες κατασκευές ...
Ted Nelson
Ted Nelson
O Ted Nelson αναφέρεται συχνά ως ένας από τους θεωρητικούς του παγκόσμιου ιστού, αλλά αυτό είναι μόνο εν μέρει σωστό. Πράγματι ασχολήθηκε με τα ψηφιακά έγγρα...
Spacewar
Xerox Star
Τερματικό
Hypercard
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Arduino
Εξομοιωτής Τερματικού
Superpaint
Διδακτορικό
Back to Top ↑MIT Lincoln
Back to Top ↑Windows
Don Norman
Canon Cat
Jef Raskin
Ο Jef Raskin, όπως και οι περισσότεροι πρωτοπόροι των υπολογιστών, δεν σπούδασε κάτι σχετικό με την πληροφορική, ενώ παράλληλα είχε πολλά ενδιαφέροντα με κεν...
Larry Tesler
Larry Tesler
Ο Larry Tesler στην πρώτη προγραμματιστική δουλειά του προσπάθησε να βελτιώσει την ευχρηστία μιας διεπαφής σχεδίασης γραφικών για μεγάλες οθόνες σε στάδια πο...
Touch
Η Διεπαφή της αφής
Σε μια ομιλία του το 1965 στη Διεθνή Ομοσπονδία Επεξεργασίας Πληροφοριών, ο πρωτοπόρος μηχανικός της πληροφορικής Ivan Sutherland περιέγραψε λεπτομερώς το όρ...
History
Η Διεπαφή της αφής
Σε μια ομιλία του το 1965 στη Διεθνή Ομοσπονδία Επεξεργασίας Πληροφοριών, ο πρωτοπόρος μηχανικός της πληροφορικής Ivan Sutherland περιέγραψε λεπτομερώς το όρ...
Tactile
Η Διεπαφή της αφής
Σε μια ομιλία του το 1965 στη Διεθνή Ομοσπονδία Επεξεργασίας Πληροφοριών, ο πρωτοπόρος μηχανικός της πληροφορικής Ivan Sutherland περιέγραψε λεπτομερώς το όρ...
Haptics
Η Διεπαφή της αφής
Σε μια ομιλία του το 1965 στη Διεθνή Ομοσπονδία Επεξεργασίας Πληροφοριών, ο πρωτοπόρος μηχανικός της πληροφορικής Ivan Sutherland περιέγραψε λεπτομερώς το όρ...
ατμοσφαιρική ρύπανση
Raspberry Pi
Back to Top ↑Wikipedia
X-Windows
Jef Raskin
Liza
VPL
Back to Top ↑DEC
Παγκόσμιος Ιστός
WYSIWYG
Επεξεργασία Εικόνας
Nova
Steve Jobs
Xerox PARC
Το ερευνητικό κέντρο της Xerox με την ονομασία PARC (Palo Alto Research Center) δημιουργήθηκε το 1970 με στόχο να επενδύσει τα μεγάλα κέρδη που είχε η μητρικ...
Bret Victor
Alan Kay
Από πολύ μικρή ηλικία ο Alan Kay έχει παρουσιάσει σημαντικά ταλέντα, όπως ανάγνωση πριν πάει στο δημοτικό, με αποτέλεσμα να βαριέται στην τάξη, αφού ήδη γνώρ...
HTML
3D Name
Γραμματα με κινηση τυπου 3D. Στο παρακάτω παράδειγμα παρουσιάζεται ένας τρόπος να εμφανίσουμε κειμενο στην οθονη με 3D χαρακτηριστικά!
Carusel
Responsive Image Carousel ( Animation ). Εδώ έχουμε έναν διαφορετικό τρόπο μετακύλισης εικόνων με πιθανή χρήση σε portfolio φωτογραφου!
Stimulus 1
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
Stimulus 2
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
CSS
3D Name
Γραμματα με κινηση τυπου 3D. Στο παρακάτω παράδειγμα παρουσιάζεται ένας τρόπος να εμφανίσουμε κειμενο στην οθονη με 3D χαρακτηριστικά!
Carusel
Responsive Image Carousel ( Animation ). Εδώ έχουμε έναν διαφορετικό τρόπο μετακύλισης εικόνων με πιθανή χρήση σε portfolio φωτογραφου!
Stimulus 1
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
Stimulus 2
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
Javascript
Carusel
Responsive Image Carousel ( Animation ). Εδώ έχουμε έναν διαφορετικό τρόπο μετακύλισης εικόνων με πιθανή χρήση σε portfolio φωτογραφου!
Stimulus 1
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
Stimulus 2
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
Shopping List
Αυτό το παράδειγμα δημιουργεί μια απλή λίστα χρησιμοποιώντας HTML και JavaScript. Tο παράδειγμα σας δίνει ένα βασικό πλαίσιο για τη δημιουργία μιας λίστας κ...
programming
Programmable WEB interactivity
Generic pαράδειγμα διαδραστικού κώδικα που χρησιμοποιεί javascript με ελάχιστη HTML και χρησιμοποιεί τις ιδιότητες του DOM (Document Object Model) και του CS...
noble-book
Το βιβλίο του Noble [@noble2009programming] είναι περισσότερο όμοιο με αυτό το βιβλίο από τα άλλα, καθώς είναι πολύ προσβάσιμο και δίνει έμφαση στην οπτικοπο...
olsen-book
Το βιβλίο του Olsen [@olsen2009building] περιγράφει κυρίως τις γραφικές διεπαφές του επιτραπέζιου ΗΥ, πολλές από τις οποίες έχουν και εφαρμογή σε φορητές συσ...
thimbleby-book
Το βιβλίο του Thimbleby [@thimbleby2007press] είναι περισσότερο προσβάσιμο και δεν έχει υψηλές απαιτήσεις αναφορικά με προηγούμενες γνώσεις, ταυτόχρονα όμως ...
image
3D image
Διαδραστικό παράδειγμα εικόνων χρησιμοποιώντας την τεχνική parallax. Στο συγκεκριμένο παράδειγμα η τεχνική αυτή δημιουργεί την αίσθηση του 3d περιβαλλντος. Ο...
Image processing
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
Image zoom
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
Image
Διαδραστικό παράδειγμα κώδικα που εισάγει μια εικόνα τύπου SVG (https://en.wikipedia.org/wiki/Scalable_Vector_Graphics). Όταν εκτελείται από το χρήστη η λειτ...
Magic Cap
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Augmented Reality
CoSpacesEdu
Τίτλος: Ενίσχυση της Μάθησης μέσω Διαδραστικού Αφήγησης στο CoSpaces. Figure 1: cospaces - Η εμπειρία επαυξημένης πραγματικότητας στην εκπαίδευση μ...
Google Glass: Η περίπτωση μιας αποτυχίας
Figure 1: Το κύριο χαρακτηριστικό του Google Glass είναι η συνοχή. Παρέχει συνεχή αλληλεπίδραση μεταξύ του υπολογιστή και του χρήστη, πράγμα που ση...
LINC
Back to Top ↑Apple I
Back to Top ↑Apple II
Back to Top ↑Lisa
Back to Top ↑Logo
Back to Top ↑Γραμμή Εντολών
Pong
Back to Top ↑Πληκτρολόγιο Ακόρντων
MSDOS
Back to Top ↑CPM
Back to Top ↑tablet
Back to Top ↑laptop
Back to Top ↑vim
IBM
Back to Top ↑iPod
Back to Top ↑DataGlove
Back to Top ↑MIT
Τηλεδιάσκεψη
Back to Top ↑Xanadu
Star
Εικονίδια
Tab
Board
Xerox Bravo
scroll
Animate with mouse slider
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή ελέγχου της κίνησης αντικειμένου on screen. Η κύλιση του χειριστιρίου του slider δίνει ...
Menu scroll
Διαδραστικό παράδειγμα responsive μενού σε One page template χρησιμοποιώντας τη βιβιοθήκη Τwitter Βootstrap 3.0 . Στο παράδειγμα εμφανίζεται το μενού έπειτα ...
Mouse scroll
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου και δίνει ως έξοδο το ανάλογο αποτέλεσμα στην οθόνη. Για να αλλάξει η τιμή εισό...
video
Form validation
Το παράδειγμα αυτό βασίζεται σε regular expression για να εντοπίσει σφάλματα στην είσοδου του χρήστη.
Plyr video player
Το βίντεο χρησιμοποιεί για τον έλεγχο το σύστημα αναπαραγωγής της βιβλιοθήκης Plyr.
YouTube video player
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου. Το βίντεο χρησιμοποιεί για την έναρξη και την παύση του το σύστημα αναπαραγωγή...
visualization
Google Charts Visualization
Παράδειγμα που παρουσιάζει το πληθυσμό και GDP Κύπρου και Ελλάδας. Το γράφημα αλλάζει μέσω ενός dropdown menu.
Visualization dataset
Διαδραστικό παράδειγμα γραφήματος χρησιμοποιώντας τη βιβλιοθήκη d3.js (http://d3js.org). Το παράδειγμα οπτικοποιεί 2 διαφορετικά σετ δεδομένων (datasets).
Visualization
Παράδειγμα διαδραστικού γραφήματος No.1
Sword of Damocles
Ivan Sutherland
Ο Ivan Sutherland μεγάλωσε παίζοντας μια γερμανική εκδοχή των Lego, όπου ένα μικρό σετ από γεωμετρικά σχήματα μπορεί να δώσει μορφή σε πολύπλοκες κατασκευές ...
Virtual Reality
Jaron Lanier
Ο Jaron Lanier έγινε ευρύτερα γνωστός για τον προβληματισμό σχετικά με τα κοινωνικά μέσα και τους μηχανισμούς εξατομίκευσης που χρησιμοποιούν. Ηταν ήδη όμως ...
CoSpacesEdu
Τίτλος: Ενίσχυση της Μάθησης μέσω Διαδραστικού Αφήγησης στο CoSpaces. Figure 1: cospaces - Η εμπειρία επαυξημένης πραγματικότητας στην εκπαίδευση μ...
Google Glass
Google Glass: Η περίπτωση μιας αποτυχίας
Figure 1: Το κύριο χαρακτηριστικό του Google Glass είναι η συνοχή. Παρέχει συνεχή αλληλεπίδραση μεταξύ του υπολογιστή και του χρήστη, πράγμα που ση...
AR
Google Glass: Η περίπτωση μιας αποτυχίας
Figure 1: Το κύριο χαρακτηριστικό του Google Glass είναι η συνοχή. Παρέχει συνεχή αλληλεπίδραση μεταξύ του υπολογιστή και του χρήστη, πράγμα που ση...
VR
Google Glass: Η περίπτωση μιας αποτυχίας
Figure 1: Το κύριο χαρακτηριστικό του Google Glass είναι η συνοχή. Παρέχει συνεχή αλληλεπίδραση μεταξύ του υπολογιστή και του χρήστη, πράγμα που ση...
GUI
Linux_GUI
Η διεπαφή ανθρώπου-υπολογιστή (Human-Computer Interaction - HCI) αποτελεί έναν κρίσιμο τομέα στον σχεδιασμό και την ανάπτυξη λειτουργικών συστημάτων, καθώς ε...
WWW
World Wide Web
Η κατασκευή του συστήματος World Wide Web (WWW) και κυρίως η πολύ γρήγορη αποδοχή του από ένα μεγάλο εύρος χρηστών ήταν μια εξέλιξη κομβικής σημασίας για την...
αισθητήρες
Bell Labs
Back to Top ↑Oberon
Back to Top ↑Biology
Back to Top ↑Ecology
Back to Top ↑Earth Science
Back to Top ↑Geography
Back to Top ↑Συναρμολογούμενο
Back to Top ↑VNC
Back to Top ↑tmux
Breakout
Back to Top ↑Lunar Lander
Back to Top ↑Commodore PET
Back to Top ↑WordStar
Back to Top ↑Damocles Sword
Back to Top ↑Tablet
Back to Top ↑IDE
Πένα
Back to Top ↑iTV
Back to Top ↑Pebble
Back to Top ↑Minecraft
Back to Top ↑Παραθυρικό Περιβάλλον
Back to Top ↑Niklaus Wirth
Back to Top ↑PDP
Back to Top ↑Reactable
Back to Top ↑history
Back to Top ↑invention
Back to Top ↑technology
Back to Top ↑Knuth
Back to Top ↑Myron Krueger
Back to Top ↑picasso
Back to Top ↑Arithmology
Guess The Hidden Number
Στο παρακάτω παραδειγμα ο χρήστης έχει τη δυνατότητα να μαντέψει το κρυμμένο αριθμό. Εμφανίζονται τρεις κάρτες με αριθμούς, εκ των οποίων η μια ειναι κρυφή. ...
Take a Wish!
Στο παρακάτω παραδειγμα ο χρήστης μπορεί να πατήσει το κουμπί απο εναν αριθμό και να εμφανιστεί μια ευχή. Ο χρήστης μπορεί να πατήσει όσα κουμπιά θέλει, όσες...
Visualization
Guess The Hidden Number
Στο παρακάτω παραδειγμα ο χρήστης έχει τη δυνατότητα να μαντέψει το κρυμμένο αριθμό. Εμφανίζονται τρεις κάρτες με αριθμούς, εκ των οποίων η μια ειναι κρυφή. ...
Interactive Charts with Chart.js
Το παρακάτω παράδειγμα δημιουργεί διαδραστικά γραφήματα χρησιμοποιώντας τη βιβλιοθήκη Chart.js. Τα γραφήματα εμφανίζουν δεδομένα με διάφορες οπτικοποιήσεις, ...
Game
Guess The Hidden Number
Στο παρακάτω παραδειγμα ο χρήστης έχει τη δυνατότητα να μαντέψει το κρυμμένο αριθμό. Εμφανίζονται τρεις κάρτες με αριθμούς, εκ των οποίων η μια ειναι κρυφή. ...
Take a Wish!
Στο παρακάτω παραδειγμα ο χρήστης μπορεί να πατήσει το κουμπί απο εναν αριθμό και να εμφανιστεί μια ευχή. Ο χρήστης μπορεί να πατήσει όσα κουμπιά θέλει, όσες...
Form
Interactive Product Catalog with Form Submission
Αυτό το διαδραστικό παράδειγμα κώδικα παρουσιάζει έναν κατάλογο προϊόντων που επιτρέπει στους χρήστες να προσθέτουν νέα προϊόντα μέσω μιας φόρμας. Τα προϊόντ...
Ιnteractive calendar with reminders
Αυτό το έργο είναι ένα διαδραστικό ημερολόγιο με λειτουργικότητα υπενθυμίσεων. Οι χρήστες μπορούν να προσθέσουν υπενθυμίσεις για συγκεκριμένες ημερομηνίες ει...
Server Render HTML
Stimulus 1
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
Stimulus 2
To Stimulus JS είναι ένα εργαλείο javascript για frond end τύπου framework όπου προγραμματίζεται η διάδραση μέσω data-attributes που υπάρχουν στην γλώσσα jav...
camera
Camera motion color
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει ένα πλαίσιο πράσινου χρώματος . Όταν εντοπιστεί κίνηση μέσα στο πλαίσιο αλλάζει το χρώ...
Camera motion
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει δύο διαφορετικά πλαίσια (πράσινο και κόκκινο). Όταν εντοπιστεί κίνηση σε κάποιο πλαίσι...
motion
Camera motion color
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει ένα πλαίσιο πράσινου χρώματος . Όταν εντοπιστεί κίνηση μέσα στο πλαίσιο αλλάζει το χρώ...
Camera motion
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει δύο διαφορετικά πλαίσια (πράσινο και κόκκινο). Όταν εντοπιστεί κίνηση σε κάποιο πλαίσι...
css
CSS queries
Παράδειγμα κώδικα με σκοπό να γίνει κατανοητή η χρήση των CSS media queries. Αλλάζοντας το μέγεθος του παραθύρου του περιηγητή (browser) σας αλλάζει το χρώμα...
Menu CSS
Παράδειγμα εναλλακτικού μενού χωρίς τη χρήση Javascript. Για τη δημιουργία της διάδρασης έχει χρησιμοποιηθεί ο CSS preprocessor SCSS.
animation
Programmable WEB interactivity
Generic pαράδειγμα διαδραστικού κώδικα που χρησιμοποιεί javascript με ελάχιστη HTML και χρησιμοποιεί τις ιδιότητες του DOM (Document Object Model) και του CS...
Animate with mouse slider
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή ελέγχου της κίνησης αντικειμένου on screen. Η κύλιση του χειριστιρίου του slider δίνει ...
input
Fibonacci
Διαδραστικό παράδειγμα κώδικα για το αν ένας αριθμός είναι Fibonacci ( https://en.wikipedia.org/wiki/Fibonacci_sequence ). Ο χρήστης εισάγει τον αριθμό μέσω ...
Keyboard input
Μετακίνηση αντικειμένου μέσω πληκτρολογίου (html Canvas)
form
Firebase form
Η φόρμα χρησιμοποιεί την δικτυακή βάση δεδομένων firebase.
Mouse form
Παράδειγμα εισόδου μέσω της συσκευής Ποντίκι Νο.4
Google maps
Έυρεση τοποθεσίας χρήστη χρησιμοποιώντας το Google Maps API (https://developers.google.com/maps/?hl=en).
Maps location
Εύρεση τοποθεσίας μέσω της χρήσης φόρμας εισόδου και του Google Maps API (https://developers.google.com/maps/?hl=en).
map
Google maps
Έυρεση τοποθεσίας χρήστη χρησιμοποιώντας το Google Maps API (https://developers.google.com/maps/?hl=en).
Maps location
Εύρεση τοποθεσίας μέσω της χρήσης φόρμας εισόδου και του Google Maps API (https://developers.google.com/maps/?hl=en).
General Magic
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
iPad
Back to Top ↑Gypsy
Larry Tesler
Ο Larry Tesler στην πρώτη προγραμματιστική δουλειά του προσπάθησε να βελτιώσει την ευχρηστία μιας διεπαφής σχεδίασης γραφικών για μεγάλες οθόνες σε στάδια πο...
Amiga
Σχετικά με την Amiga
Στην Commodore λοιπόν ο σχεδιασμός για το μέλλον ήταν σαφής. Χρειάζονταν ένα σύστημα που θα είχε τις δυνατότητες της Amiga 1000 παράλληλα όμως θα είχε σημαντ...
Linux
Linux_GUI
Η διεπαφή ανθρώπου-υπολογιστή (Human-Computer Interaction - HCI) αποτελεί έναν κρίσιμο τομέα στον σχεδιασμό και την ανάπτυξη λειτουργικών συστημάτων, καθώς ε...
Bill English
Xerox PARC
Το ερευνητικό κέντρο της Xerox με την ονομασία PARC (Palo Alto Research Center) δημιουργήθηκε το 1970 με στόχο να επενδύσει τα μεγάλα κέρδη που είχε η μητρικ...
educational
The Egg
H Επιστήμη του Λαού ήρθε στην τάξη. Εισηχθησαν έννοιες ποιότητας αέρα σε πραγματικό πλαίσιο. Μελετώντας τη ρύπανση σε τοπικά περιβάλλοντα, οι μαθητές μαθαίνο...
Tinkercad
Εκδημοκρατισμός Σχεδιασμού και Ηλεκτρονικής για Όλους. Το Tinkercad, μια δωρεάν διαδικτυακή εφαρμογή που αναπτύχθηκε από την Autodesk, έχει φέρει επανάσταση ...
Ατμοσφαιρική Ρύπανση
Back to Top ↑Τοποθεσία χρήστη
Plan9
Back to Top ↑Sam
Back to Top ↑Amaya
Back to Top ↑Ivan Shutherland
Apple Newton
Back to Top ↑Έξυπνο Ρολόϊ
Back to Top ↑Swyftware
Back to Top ↑Processing
Ολοκληρωμένο Περιβάλλον Ανάπτυξης
Back to Top ↑MIT Media Lab
Back to Top ↑Dataland
Back to Top ↑Space Invaders
Back to Top ↑Adventure
Back to Top ↑Apple Lisa
Back to Top ↑Προγραμματισμός
Back to Top ↑Cedar
Back to Top ↑Air Quality
Back to Top ↑Μικροϋπολογιστές
Back to Top ↑Bill Gates
Back to Top ↑dynabook
Back to Top ↑editor
Back to Top ↑PDA
Back to Top ↑RAND
Back to Top ↑Github
Back to Top ↑Rand
Back to Top ↑GRAIL
Back to Top ↑Έξυπνο κινητό
Back to Top ↑BBC micro
Back to Top ↑Desktop
Back to Top ↑Newton
Back to Top ↑Kinect
Back to Top ↑Φωτογραφία
Έξυπνο ρολόϊ
Back to Top ↑IBM PC
Back to Top ↑Seymour Papert
Back to Top ↑Scratch
Back to Top ↑Έξυπνο Κινητό
Back to Top ↑MAX-MSP
Back to Top ↑Apple 2
Back to Top ↑multimodal
Back to Top ↑Υπόδειγμα
Back to Top ↑Χαμηλή Πιστότητα
Back to Top ↑Σχεδιάγραμμα
Back to Top ↑OLPC
Back to Top ↑PLATO
Back to Top ↑Apple2
Back to Top ↑TX-2
Back to Top ↑Steve Mann
Back to Top ↑NASA
Back to Top ↑Pad
Back to Top ↑PARC
Back to Top ↑Τερματικό Κειμένου
Back to Top ↑Tiled Windows
Back to Top ↑Stacked Windows
Back to Top ↑DEC PDP
Back to Top ↑Xerox
Back to Top ↑Xerox Gypsy
Back to Top ↑Liveboard
Back to Top ↑activity tracker
Quantified Self
Μέτρηση Φυσικής Δραστηριότητας Ανάλυση σχετικών έργων Να καταγράψετε τις ιδιότητες μερικών (3-4) εφαρμογών ενθάρρυνσης της φυσικής άσκησης. Να διαλ...
Quantified Self
Quantified Self
Μέτρηση Φυσικής Δραστηριότητας Ανάλυση σχετικών έργων Να καταγράψετε τις ιδιότητες μερικών (3-4) εφαρμογών ενθάρρυνσης της φυσικής άσκησης. Να διαλ...
collaborative system
Collaborative System
Συνεργατικό σύστημα Ανάλυση σχετικών έργων Να καταγράψετε τις ιδιότητες μερικών (3-4) συνεργατικών εκπαιδευτικών εφαρμογών. Να διαλέξετε είτε εφαρμ...
media player
Media Player
Αναπαραγωγή βίντεο Ανάλυση σχετικών έργων Να καταγράψετε τις ιδιότητες μερικών (3-4) εφαρμογών που παίζουν βίντεο ή μουσική, και που είναι ελεύθερα...
mobile notes
Mobile Notes
Κινητές σημειώσεις
Photography
Photography
Φωτογραφία
tv remote
Remote Control
Τηλεχειρισμός Ανάλυση σχετικών έργων Να καταγράψετε τις ιδιότητες μερικών (3-4) εφαρμογών που είναι ελεύθερα διαθέσιμες στον υπολογιστή, για τον τη...
video game
Video Game
Εκπαιδευτικό βίντεο-παιχνίδι Ανάλυση σχετικών έργων Να καταγράψετε τις ιδιότητες μερικών (3-4) βίντεο-παιχνιδιών που είναι ελεύθερα διαθέσιμα στον ...
Aristotle
Back to Top ↑Grady Booch
Back to Top ↑Bill Buxton
Back to Top ↑Auguste Comte
Back to Top ↑culture
Back to Top ↑Confucius
Back to Top ↑Freeman Dyson
Back to Top ↑Albert Einstein
Back to Top ↑Odysseas Elytis
Back to Top ↑Antoine de Saint-Exupery
Back to Top ↑Feynman
Back to Top ↑Thomas C. Gale
Back to Top ↑Jesse James Garrett
Back to Top ↑C.A.R. Hoare
Back to Top ↑John Holt
Back to Top ↑computer science
Back to Top ↑generation
Back to Top ↑medium
Back to Top ↑J. C. R. Licklider
Back to Top ↑Marshall McLuhan
Back to Top ↑Marvin Minsky
Back to Top ↑Ken Olsen
Back to Top ↑Paul Rand
Back to Top ↑Scott Rosenberg
Back to Top ↑Bjarne Stroustrup
Back to Top ↑graphics
Back to Top ↑Thomas J Watson
Back to Top ↑Mark Weiser
Back to Top ↑3D
3D Name
Γραμματα με κινηση τυπου 3D. Στο παρακάτω παράδειγμα παρουσιάζεται ένας τρόπος να εμφανίσουμε κειμενο στην οθονη με 3D χαρακτηριστικά!
Charts
Interactive Charts with Chart.js
Το παρακάτω παράδειγμα δημιουργεί διαδραστικά γραφήματα χρησιμοποιώντας τη βιβλιοθήκη Chart.js. Τα γραφήματα εμφανίζουν δεδομένα με διάφορες οπτικοποιήσεις, ...
palindrome
Palindrome Checker
Καρκινικές επιγραφές ή καρκίνοι ονομάζονται συμμετρικές φράσεις οι οποίες μπορούν να διαβαστούν το ίδιο είτε από την αρχή είτε από το τέλος.Για την λόγο αυτό...
Entertainment
Take a Wish!
Στο παρακάτω παραδειγμα ο χρήστης μπορεί να πατήσει το κουμπί απο εναν αριθμό και να εμφανιστεί μια ευχή. Ο χρήστης μπορεί να πατήσει όσα κουμπιά θέλει, όσες...
todolist
TodoList
Μια λίστα υποχρεώσεων είναι μια λίστα στοιχείων που πρέπει να συμπληρωθούν. Τα στοιχεία της λίστας μπορεί να κυμαίνονται από απλές δραστηριότητες, όπως απάντ...
calculator
Calculator
Παράδειγμα οπτικής και λειτουργικής εξομοίωσης αριθμομηχανής.
color
Camera motion color
Διαδραστικό παράδειγμα κώδικα με χρήση κάμερας. Στο παράδειγμα υπάρχει ένα πλαίσιο πράσινου χρώματος . Όταν εντοπιστεί κίνηση μέσα στο πλαίσιο αλλάζει το χρώ...
queries
CSS queries
Παράδειγμα κώδικα με σκοπό να γίνει κατανοητή η χρήση των CSS media queries. Αλλάζοντας το μέγεθος του παραθύρου του περιηγητή (browser) σας αλλάζει το χρώμα...
WEB
Programmable WEB interactivity
Generic pαράδειγμα διαδραστικού κώδικα που χρησιμοποιεί javascript με ελάχιστη HTML και χρησιμοποιεί τις ιδιότητες του DOM (Document Object Model) και του CS...
javascript
Programmable WEB interactivity
Generic pαράδειγμα διαδραστικού κώδικα που χρησιμοποιεί javascript με ελάχιστη HTML και χρησιμοποιεί τις ιδιότητες του DOM (Document Object Model) και του CS...
quotes
Famous Quotes
Αυτό το διαδραστικό παράδειγμα κώδικα δημιουργεί μια απλή εφαρμογή για τυχαία αποφθέγματα. Με κάθε κλικ πάνω στο κουμπί new quote φορτώνει ένα καινούργιο τυχ...
sequence
Fibonacci
Διαδραστικό παράδειγμα κώδικα για το αν ένας αριθμός είναι Fibonacci ( https://en.wikipedia.org/wiki/Fibonacci_sequence ). Ο χρήστης εισάγει τον αριθμό μέσω ...
database
Firebase form
Η φόρμα χρησιμοποιεί την δικτυακή βάση δεδομένων firebase.
UX
Animate with mouse slider
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή ελέγχου της κίνησης αντικειμένου on screen. Η κύλιση του χειριστιρίου του slider δίνει ...
google-charts
Google Charts Visualization
Παράδειγμα που παρουσιάζει το πληθυσμό και GDP Κύπρου και Ελλάδας. Το γράφημα αλλάζει μέσω ενός dropdown menu.
3d
3D image
Διαδραστικό παράδειγμα εικόνων χρησιμοποιώντας την τεχνική parallax. Στο συγκεκριμένο παράδειγμα η τεχνική αυτή δημιουργεί την αίσθηση του 3d περιβαλλντος. Ο...
filter
Image processing
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
zoom
Image zoom
Παράδειγμα διαδραστικού κώδικα στον οποίο όταν εκτελείται από το χρήστη η λειτουργία hover (κίνηση του ποντικιού πάνω από την εικόνα στο συγκεκριμένο παράδει...
text
Interactive Text
Διαδραστικό παράδειγμα κώδικα που δημιουργεί ειδικά εφέ κατά το Hover (κίνηση του ποντικιού πάνω από την εικόνα) πάνω στο κείμενο. Για τη δημιουργία αυτών τω...
keyboard
Keyboard input
Μετακίνηση αντικειμένου μέσω πληκτρολογίου (html Canvas)
location
Maps location
Εύρεση τοποθεσίας μέσω της χρήσης φόρμας εισόδου και του Google Maps API (https://developers.google.com/maps/?hl=en).
dropdown
Menu dropdown
Διαδραστικό παράδειγμα dropdown μενού χωρίς τη χρήση Javascript.
empty
Menu empty
Παράδειγμα εναλλακτικού μενού χωρίς ενσωματωμένες λειτουργίες.
pie
Menu pie
Διαδραστικό παράδειγμα πολύπλοκου κυκλικού μενού. Με την επιλογή του κουμπιού “open” από το χρήστη, εμφανίζονται μια σειρά από πιθανές επιλογές.
slide
Menu slide
Παράδειγμα slide μενού χωρίς ενσωματωμένες λειτουργίες.
draw
Mouse draw
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως συσκευή εισόδου. Ο χρήστης μπορεί να χρησιμοποιήσει το ποντίκι για να σχεδιάσει στη λευκή επιφά...
eraser
Mouse eraser
Παράδειγμα διαδραστικού κώδικα που χρησιμοποιεί το ποντίκι ως “σβηστήρι”. Υπάρχουν δύο διαθέσιμες εικόνες και η μία σβήνει μετακινώντας τον κέρσορα για να απ...
option
Mouse option
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, μπορεί να αλλάξει δυναμικά το περιεχόμενο που θα εμφανίζεται στη σελίδα. Για το σκο...
bar
Nav Bar
Παράδειγμα διαδραστικού κώδικα όπου ο χρήστης χρησιμοποιώντας το ποντίκι, μπορεί να κάνει κλικ σε κάθε μία από τις επιλογές της navigation bar.
Password
Random Password Generator
Αυτό το διαδραστικό παράδειγμα κώδικα δημιουργεί μια εφαρμογή για τη δημιουργία κωδικών πρόσβασης για το χρήστη. Ο χρήστης μπορεί να επιλέξει το μέγεθος του ...
Vou js
Shopping List
Αυτό το παράδειγμα δημιουργεί μια απλή λίστα χρησιμοποιώντας HTML και JavaScript. Tο παράδειγμα σας δίνει ένα βασικό πλαίσιο για τη δημιουργία μιας λίστας κ...
html
Shopping List
Αυτό το παράδειγμα δημιουργεί μια απλή λίστα χρησιμοποιώντας HTML και JavaScript. Tο παράδειγμα σας δίνει ένα βασικό πλαίσιο για τη δημιουργία μιας λίστας κ...
sortable
Sortable list
Παράδειγμα διαδραστικού κώδικα που ταξινομεί μια λίστα με τη χρήση του ποντικιού. Χρησιμοποιείται το στοιχείο sortable της JavaScript βιβλιοθήκης JQueryUI (...
list
Sortable list
Παράδειγμα διαδραστικού κώδικα που ταξινομεί μια λίστα με τη χρήση του ποντικιού. Χρησιμοποιείται το στοιχείο sortable της JavaScript βιβλιοθήκης JQueryUI (...
dataset
Visualization dataset
Διαδραστικό παράδειγμα γραφήματος χρησιμοποιώντας τη βιβλιοθήκη d3.js (http://d3js.org). Το παράδειγμα οπτικοποιεί 2 διαφορετικά σετ δεδομένων (datasets).
Weather
Weather API
Αυτό το διαδραστικό παράδειγμα κώδικα δημιουργεί μια εφαρμογή για την ανάγνωση των καιρικών συνθηκών σε μια πόλη. Ο χρήστης πληκτρολογώντας το όνομα της πόλη...
Calendar
Ιnteractive calendar with reminders
Αυτό το έργο είναι ένα διαδραστικό ημερολόγιο με λειτουργικότητα υπενθυμίσεων. Οι χρήστες μπορούν να προσθέσουν υπενθυμίσεις για συγκεκριμένες ημερομηνίες ει...
noble
noble-book
Το βιβλίο του Noble [@noble2009programming] είναι περισσότερο όμοιο με αυτό το βιβλίο από τα άλλα, καθώς είναι πολύ προσβάσιμο και δίνει έμφαση στην οπτικοπο...
olsen
olsen-book
Το βιβλίο του Olsen [@olsen2009building] περιγράφει κυρίως τις γραφικές διεπαφές του επιτραπέζιου ΗΥ, πολλές από τις οποίες έχουν και εφαρμογή σε φορητές συσ...
thimbleby
thimbleby-book
Το βιβλίο του Thimbleby [@thimbleby2007press] είναι περισσότερο προσβάσιμο και δεν έχει υψηλές απαιτήσεις αναφορικά με προηγούμενες γνώσεις, ταυτόχρονα όμως ...
PhotoCard
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Double click
Bill Atkinson
Figure 1: Ο Bill Atkinson ήταν βασικός συντελεστής σε σημαντικά προϊόντα όπως τα Apple Lisa και Macintosh, καθώς και το Apple Paint, όπου κατασκεύα...
Brenda Laurel
Back to Top ↑ποντίκι
Douglas Engelbart
O Douglas Engelbart έγινε διάσημος για την συσκευή εισόδου ποντίκι,1 αλλά αυτό θεωρείται μόνο μια μικρή παράπλευρη εφεύρεση σε σχέση με το σύνολο της συνεισφ...
Επαυξημένη Νοημοσύνη
Douglas Engelbart
O Douglas Engelbart έγινε διάσημος για την συσκευή εισόδου ποντίκι,1 αλλά αυτό θεωρείται μόνο μια μικρή παράπλευρη εφεύρεση σε σχέση με το σύνολο της συνεισφ...
SwyftCard
Jef Raskin
Ο Jef Raskin, όπως και οι περισσότεροι πρωτοπόροι των υπολογιστών, δεν σπούδασε κάτι σχετικό με την πληροφορική, ενώ παράλληλα είχε πολλά ενδιαφέροντα με κεν...
Υπερμέσα
Ted Nelson
O Ted Nelson αναφέρεται συχνά ως ένας από τους θεωρητικούς του παγκόσμιου ιστού, αλλά αυτό είναι μόνο εν μέρει σωστό. Πράγματι ασχολήθηκε με τα ψηφιακά έγγρα...
Samsung
Samsung AR Demo
Η Samsung, η μεγαλύτερη και πιο αξιόπιστη μάρκα ηλεκτρονικών ειδών ευρείας κατανάλωσης, έχει επεκτείνει τις ανέπαφες προσφορές της για τους καταναλωτές με μι...
Virtual dives
Virtual dives into the underwater archaeological treasures of South Italy
Τα εσωτερικά κίνητρα, όπως η απόλαυση και η διασκέδαση, προάγουν την εμβάθυνση της συμμετοχής και την αυξημένη επιμονή στις εκπαιδευτικές δραστηριότητες. Αυτ...
affective usability
Πέρα από την ευχρηστία
Figure 1: Τα πειράματα με εναλλακτικές διαρρυθμίσεις των πλήκτρων σε ένα απλό τραπεζικό ATM έδειξαν ότι ακόμη και αν δεν υπάρχει ουσιαστική διαφορά...
measuring air quality
AirQuality
Overview: AirVisual is a cutting-edge application designed to monitor and measure Air Quality Index (AQI) in real-time. Developed with the mission to empowe...
application
AirQuality
Overview: AirVisual is a cutting-edge application designed to monitor and measure Air Quality Index (AQI) in real-time. Developed with the mission to empowe...
Amazon
Alexa
Η Alexa1 είναι ένα σύστημα φωνητικής υπηρεσίας που αναπτύχθηκε από την Amazon, το οποίο επιτρέπει στους χρήστες να διαχειρίζονται διάφορες λειτουργίες και ε...
Alexa
Alexa
Η Alexa1 είναι ένα σύστημα φωνητικής υπηρεσίας που αναπτύχθηκε από την Amazon, το οποίο επιτρέπει στους χρήστες να διαχειρίζονται διάφορες λειτουργίες και ε...
AlterEgo
AlterEgo
Το AlterEgo1 αποτελεί έναν εκπληκτικό συγκερασμό μεταξύ τεχνολογίας και ανθρώπινης συνείδησης, προσφέροντας ένα εντυπωσιακό παράδειγμα του πώς η συγχρονισμέ...
EMG
AlterEgo
Το AlterEgo1 αποτελεί έναν εκπληκτικό συγκερασμό μεταξύ τεχνολογίας και ανθρώπινης συνείδησης, προσφέροντας ένα εντυπωσιακό παράδειγμα του πώς η συγχρονισμέ...
Silent speech Interface
AlterEgo
Το AlterEgo1 αποτελεί έναν εκπληκτικό συγκερασμό μεταξύ τεχνολογίας και ανθρώπινης συνείδησης, προσφέροντας ένα εντυπωσιακό παράδειγμα του πώς η συγχρονισμέ...
Human-Machine symbiosis
AlterEgo
Το AlterEgo1 αποτελεί έναν εκπληκτικό συγκερασμό μεταξύ τεχνολογίας και ανθρώπινης συνείδησης, προσφέροντας ένα εντυπωσιακό παράδειγμα του πώς η συγχρονισμέ...
xerox alto
Xerox Alto
Ο προσωπικός υπολογιστής θεωρείται δεδομένος για τους χρήστες μετά την δεκαετία του 1980, αλλά ήταν μόνο μια ιδέα για πολύ λίγους ερευνητές την δεκαετία του ...
arduino
Arduino
Το Arduino είναι ένας πολύ δημοφιλής μικροελεγκτής που φτιάχτηκε με αρχικό σκοπό τον προγραμματισμό και την εκπαίδευση των φοιτητών της διάδρασης ανθρώπου κα...
Augmented & Virtual Reality
Augmented & Virtual Reality
Figure 1: Ρύθμιση της σκηνής Η Preherz εισέρχεται με μια καθηλωτική πλατφόρμα AR/VR που γεφυρώνει αυτό το χάσμα. Οι χρήστες εξασκούνται σε ρεαλιστ...
Κονσόλες
Κονσόλες βιντεοπαιχνιδιών
Οι κονσόλες βιντεοπαιχνιδιών και τα βιντεοπαιχνίδια που τρέχουν σε αυτές αναπτύχθηκαν παράλληλα με τους οικιακούς μικροϋπολογιστές και έχουν ιδιαίτερη σημασί...
Interactive 3D content using a visual programming language
CoSpacesEdu
Τίτλος: Ενίσχυση της Μάθησης μέσω Διαδραστικού Αφήγησης στο CoSpaces. Figure 1: cospaces - Η εμπειρία επαυξημένης πραγματικότητας στην εκπαίδευση μ...
Simulations
CoSpacesEdu
Τίτλος: Ενίσχυση της Μάθησης μέσω Διαδραστικού Αφήγησης στο CoSpaces. Figure 1: cospaces - Η εμπειρία επαυξημένης πραγματικότητας στην εκπαίδευση μ...
education
Education
Figure 1: Technology allows an even, level, or flat playing field for economies across the world. Once individuals have access to the world wide we...
facebok
Figure 1: Μία από τις αρχικές εκδοχές είχε διαφορετικό όνομα (thefacebook) και δεν διέφερε πολύ από ένα απλό σύστημα βάσης δεδομένων με προφίλ χρησ...
Microsoft Hololens
Microsoft Hololens
Το Microsoft Hololens 1 είναι η αντίληψη της Microsoft για την επαυξημένη πραγματικότητα, την οποία αποκαλούν «μικτή πραγματικότητα». Το HoloLens υποστηρίζει...
apple
Apple iPod
Η περίπτωση της συσκευής αναπαραγωγής μουσικής iPod σήμανε την αρχή της γρήγορης μετατόπισης της διάδρασης από τον επιτραπέζιο προς τον κινητό και διάχυτο υπ...
ipod
Apple iPod
Η περίπτωση της συσκευής αναπαραγωγής μουσικής iPod σήμανε την αρχή της γρήγορης μετατόπισης της διάδρασης από τον επιτραπέζιο προς τον κινητό και διάχυτο υπ...
Macintosh Portable
Macintosh Portable
Το Macintosh Portable αντιπροσώπευε την πρώτη προσπάθεια της Apple Computer να δημιουργήσει έναν φορητό υπολογιστή Macintosh με αντοχή ενός επιτραπέζιου υπολ...
Microbit
Micro:bit
Figure 1: Το Micro Bit αναφέρεται επίσης ως BBC Micro Bit ή στυλιζαρισμένο ως micro:bit. Το πρώτο micro:bit1 επινοήθηκε από το BBC και τους ...
moding
Minecraft
Πριν ο προγραμματισμός της διάδρασης αποκτήσει πρωταγωνιστικό ρόλο στην έρευνα και στη βιομηχανία, η επιτυχία ενός προϊόντος μπορούσε να μετρηθεί από τις πωλ...
making
Minecraft
Πριν ο προγραμματισμός της διάδρασης αποκτήσει πρωταγωνιστικό ρόλο στην έρευνα και στη βιομηχανία, η επιτυχία ενός προϊόντος μπορούσε να μετρηθεί από τις πωλ...
minecraft
Minecraft
Πριν ο προγραμματισμός της διάδρασης αποκτήσει πρωταγωνιστικό ρόλο στην έρευνα και στη βιομηχανία, η επιτυχία ενός προϊόντος μπορούσε να μετρηθεί από τις πωλ...
Marc Weiser
Xerox PARC
Το ερευνητικό κέντρο της Xerox με την ονομασία PARC (Palo Alto Research Center) δημιουργήθηκε το 1970 με στόχο να επενδύσει τα μεγάλα κέρδη που είχε η μητρικ...
donald norman
Η σχεδίαση των καθημερινών πραγμάτων
Η κατανόηση και η χρήση μιας συσκευής διέπεται από μερικές βασικές και διαχρονικές αξίες που είναι οι ίδιες ανεξάρτητα από το είδος και την πολυπλοκότητα που...
reactable
Reactable
Το Reactable είναι ένα ψηφιακό μουσικό σύστημα που βασίζεται στη διάδραση με την αφή και με απτά αντικείμενα.1 Εκτός από την εκθεσιακή του εγκατάσταση και τη...
Rezzil
Rezzil
Το σύστημα VR της Rezzil παρέχει καινοτόμες λύσεις στους τομείς της υψηλής απόδοσης, της ανάπτυξης ικανότητας των παικτών, και της ανάλυσης της απόδοσης των ...
AV
Rezzil
Το σύστημα VR της Rezzil παρέχει καινοτόμες λύσεις στους τομείς της υψηλής απόδοσης, της ανάπτυξης ικανότητας των παικτών, και της ανάλυσης της απόδοσης των ...
Immersive Experience
Rezzil
Το σύστημα VR της Rezzil παρέχει καινοτόμες λύσεις στους τομείς της υψηλής απόδοσης, της ανάπτυξης ικανότητας των παικτών, και της ανάλυσης της απόδοσης των ...
raspberry
Raspberry
Το Raspberry Pi, αποτελεί μια σειρά υπολογιστών μιας πλακέτας που αναπτύχθηκε από τον οργανισμό Raspberry Pi Foundation στο Ηνωμένο Βασίλειο ο οποίος κυκλο...
xerox star
Xerox Star
Figure 1: Ο επιτραπέζιος υπολογιστής με πληκτρολόγιο, ποντίκι, και γραφική επιφάνεια εργασίας (παράθυρα, εικονίδια, φάκελοι) που δημιουργήθηκε από ...
air Quality
The Egg
H Επιστήμη του Λαού ήρθε στην τάξη. Εισηχθησαν έννοιες ποιότητας αέρα σε πραγματικό πλαίσιο. Μελετώντας τη ρύπανση σε τοπικά περιβάλλοντα, οι μαθητές μαθαίνο...
simulator
Tinkercad
Εκδημοκρατισμός Σχεδιασμού και Ηλεκτρονικής για Όλους. Το Tinkercad, μια δωρεάν διαδικτυακή εφαρμογή που αναπτύχθηκε από την Autodesk, έχει φέρει επανάσταση ...
3D disign
Tinkercad
Εκδημοκρατισμός Σχεδιασμού και Ηλεκτρονικής για Όλους. Το Tinkercad, μια δωρεάν διαδικτυακή εφαρμογή που αναπτύχθηκε από την Autodesk, έχει φέρει επανάσταση ...
unix
Unix
Το Unix είναι περισσότερο γνωστό σε όσους ασχολούνται με τα λειτουργικά συστήματα και σχεδόν καθόλου γνωστό στην κοινότητα της διάδρασης και των γραφικών διε...
vocsensor
VOC Sensor
Υπάρχουν πολλοί κίνδυνοι για την υγεία που αντιμετωπίζουμε στην καθημερινή μας ζωή. Από την οδήγηση αυτοκινήτου, την πτήση με αεροπλάνο, μέχρι το περπάτημα σ...
wikipedia
Wikipedia
Η συμμετοχική ανάπτυξη και η ευέλικτη διανομή και αλλαγή ενός προϊόντος για υπολογιστές ξεκίνησε με την περίπτωση του λογισμικού ανοικτού κώδικα. Όμως, η δια...
Microsoft windows
Microsoft Windows
Η επιφάνεια εργασίας του επιτραπέζιου υπολογιστή είναι ένα δημοφιλές και ευέλικτο σύστημα που πέρασε από πολλούς κύκλους ανάπτυξης και προσαρμογής, τόσο κατά...
Tim Berners Lee
World Wide Web
Η κατασκευή του συστήματος World Wide Web (WWW) και κυρίως η πολύ γρήγορη αποδοχή του από ένα μεγάλο εύρος χρηστών ήταν μια εξέλιξη κομβικής σημασίας για την...