Medien Wiki - User contributions [en]

IFD:Responsive Webdesign – Crash Course/Wiki Facelift and Mobile Optimization

2014-12-20T00:26:57Z

Alex: /* Linklist to prototypes */

==Linklist to prototypes==

Natalia Suárez
[http://jsbin.com/juyiwu/ My Link]

Simon Schneegans and Felix Lauer
[http://simonschneegans.de/responsive_web/ Our Link]

Nicklas Slagbrand
[http://nicklasslagbrand.se/subdoman/ My Link]

Zhang Yating
[http://jsbin.com/wugepe/ My Link]

Wang Yana
[http://jsbin.com/zogeno/ My Link]

Florian Wittig
[http://jsbin.com/fihibe/1/ My Link]

Firstname Lastname
[http://myprototype.com My Link]

Firstname Lastname
[http://myprototype.com My Link]

Andrés Arteaga
[http://jsbin.com/corig/7 My Link]

Olga Falko
[http://jsbin.com/bocagu/1 My Link]

Alexander Vogt
[http://onezeronine.com/wiki/Main_Page.html Wiki-Clone with working nav-menu]

Alexander Vogt

2014-04-28T10:08:34Z

Alex:

==Finished workaround from April, 7th:==

[http://onezeronine.com/imageviewer/ 3D Image Viewer]

==Some Shop Systems, Software, Plugins, etc:==

[http://magentocommerce.com magento]

[http://www.volusion.com volusion]

[http://www.bigcommerce.com bigcommerce]

[http://tictail.com tictail]

[http://www.fortune3.com fortune3]

[http://www.shoppingcartelite.com shoppingcartelite]

[http://www.pinnaclecart.com pinnaclecart]

[http://www.ashopcommerce.com ashopcommerce]

[http://www.x-cart.com x-cart]

[http://www.aspdotnetstorefront.com storefront]

==A review of the best 22 shopping cart solutions:==

[http://shopping-cart-review.toptenreviews.com toptenreviews (March 2014)]

==Virtual 3D Shopping Malls:==

[http://virtualeshopping.com virtuale shopping]

[http://soonique.de soonique]

[http://the360mall.com the 360 mall]

[http://the-virtualmall.com the virtual mall]

==3D Software used for (some) Malls:==

[http://unity3d.com unity 3D]

==Paper Prototype==
[[File:vogt_proto3D2.JPG|400px]] [[File:vogt_proto3D1.JPG|400px]]

File:Vogt proto3D2.JPG

2014-04-28T10:06:20Z

Alex:

== Summary ==

== Copyright status: ==

== Licensing ==
{{self|c}}
== Source: ==

File:Vogt proto3D1.JPG

2014-04-28T10:05:43Z

Alex:

== Summary ==

== Copyright status: ==

== Licensing ==
{{self|c}}
== Source: ==

Alexander Vogt

2014-04-28T08:37:18Z

Alex: /* 3D Software used for (some) Malls: */

Alexander Vogt

2014-04-28T08:36:47Z

Alex: /* Virtual 3D Shopping Malls: */

Alexander Vogt

2014-04-28T08:35:27Z

Alex: /* A review of the best 22 shopping cart solutions by toptenreviews (March 2014): */

==Finished workaround from April, 7th:==

[http://onezeronine.com/imageviewer/ 3D Image Viewer]

==Some Shop Systems, Software, Plugins, etc:==

[http://magentocommerce.com magento]

[http://www.volusion.com volusion]

[http://www.bigcommerce.com bigcommerce]

[http://tictail.com tictail]

[http://www.fortune3.com fortune3]

[http://www.shoppingcartelite.com shoppingcartelite]

[http://www.pinnaclecart.com pinnaclecart]

[http://www.ashopcommerce.com ashopcommerce]

[http://www.x-cart.com x-cart]

[http://www.aspdotnetstorefront.com storefront]

==A review of the best 22 shopping cart solutions:==

[http://shopping-cart-review.toptenreviews.com toptenreviews (March 2014)]

==Virtual 3D Shopping Malls:==

'''http://virtualeshopping.com'''

'''http://soonique.de'''

'''http://the360mall.com'''

'''http://the-virtualmall.com'''

==3D Software used for (some) Malls:==

'''http://unity3d.com'''

Alexander Vogt

2014-04-28T08:34:56Z

Alex: /* Some Shop Systems, Software, Plugins, etc: */

==Finished workaround from April, 7th:==

[http://onezeronine.com/imageviewer/ 3D Image Viewer]

==Some Shop Systems, Software, Plugins, etc:==

[http://magentocommerce.com magento]

[http://www.volusion.com volusion]

[http://www.bigcommerce.com bigcommerce]

[http://tictail.com tictail]

[http://www.fortune3.com fortune3]

[http://www.shoppingcartelite.com shoppingcartelite]

[http://www.pinnaclecart.com pinnaclecart]

[http://www.ashopcommerce.com ashopcommerce]

[http://www.x-cart.com x-cart]

[http://www.aspdotnetstorefront.com storefront]

==A review of the best 22 shopping cart solutions by toptenreviews (March 2014):==

'''http://shopping-cart-review.toptenreviews.com'''

==Virtual 3D Shopping Malls:==

'''http://virtualeshopping.com'''

'''http://soonique.de'''

'''http://the360mall.com'''

'''http://the-virtualmall.com'''

==3D Software used for (some) Malls:==

'''http://unity3d.com'''

Alexander Vogt

2014-04-28T08:31:34Z

Alex: /* Finished workaround from April, 7th (3D Image Viewer): */

==Finished workaround from April, 7th:==

[http://onezeronine.com/imageviewer/ 3D Image Viewer]

==Some Shop Systems, Software, Plugins, etc:==

'''http://magentocommerce.com'''

'''http://www.volusion.com'''

'''http://www.bigcommerce.com'''

'''http://tictail.com'''

'''http://www.fortune3.com'''

'''http://www.shoppingcartelite.com'''

'''http://www.pinnaclecart.com'''

'''http://www.ashopcommerce.com'''

'''http://www.x-cart.com'''

'''http://www.aspdotnetstorefront.com'''

==A review of the best 22 shopping cart solutions by toptenreviews (March 2014):==

'''http://shopping-cart-review.toptenreviews.com'''

==Virtual 3D Shopping Malls:==

'''http://virtualeshopping.com'''

'''http://soonique.de'''

'''http://the360mall.com'''

'''http://the-virtualmall.com'''

==3D Software used for (some) Malls:==

'''http://unity3d.com'''

Alexander Vogt

2014-04-28T08:27:15Z

Alex:

==Finished workaround from April, 7th (3D Image Viewer):==

'''http://onezeronine.com/imageviewer/'''

==Some Shop Systems, Software, Plugins, etc:==

'''http://magentocommerce.com'''

'''http://www.volusion.com'''

'''http://www.bigcommerce.com'''

'''http://tictail.com'''

'''http://www.fortune3.com'''

'''http://www.shoppingcartelite.com'''

'''http://www.pinnaclecart.com'''

'''http://www.ashopcommerce.com'''

'''http://www.x-cart.com'''

'''http://www.aspdotnetstorefront.com'''

==A review of the best 22 shopping cart solutions by toptenreviews (March 2014):==

'''http://shopping-cart-review.toptenreviews.com'''

==Virtual 3D Shopping Malls:==

'''http://virtualeshopping.com'''

'''http://soonique.de'''

'''http://the360mall.com'''

'''http://the-virtualmall.com'''

==3D Software used for (some) Malls:==

'''http://unity3d.com'''

Alexander Vogt

2014-04-28T08:21:52Z

Alex:

==Some Shop Systems, Software, Plugins, etc :==

'''http://magentocommerce.com'''

'''http://www.volusion.com'''

'''http://www.bigcommerce.com'''

'''http://tictail.com'''

'''http://www.fortune3.com'''

'''http://www.shoppingcartelite.com'''

'''http://www.pinnaclecart.com'''

'''http://www.ashopcommerce.com'''

'''http://www.x-cart.com'''

'''http://www.aspdotnetstorefront.com'''

==A review of the best 22 shopping cart solutions by toptenreviews (March 2014):==

'''http://shopping-cart-review.toptenreviews.com'''

==Virtual 3D Shopping Malls:==

'''http://virtualeshopping.com'''

'''http://soonique.de'''

'''http://the360mall.com'''

'''http://the-virtualmall.com'''

==3D Software used for (some) Malls:==

'''http://unity3d.com'''

Alexander Vogt

2014-04-28T07:56:50Z

Alex: Created page with "Virtual 3D Shopping Malls: http://virtualeshopping.com"

Virtual 3D Shopping Malls:

http://virtualeshopping.com

IFD:ThreedimensionalWebinterfaces

2014-04-28T07:55:55Z

Alex: /* Participants */

[[:Category:Werkmodul|Werkmodul]] | [[:Category:Fachmodul|Fachmodul]] 
''Lehrperson:'' [[Gabriel Rausch]] 
''Bewertung:'' 6 [[ECTS]], 4 [[SWS]] 
''Termin:'' Monday, 13:30 - 15:45 
''Ort:'' Marienstr. 7b, Raum 105 

''Erster Termin:'' Mo, April 7th 2014

==Three-dimensional web-interfaces==
new approaches in eCommerce and eLearning
This course is dedicated to all design- and media-students who are interested in frontend-development of websites and applications and have first experience in complex visualization techniques (using CSS3-Transforms or WebGL or other techniques). The course is like an optional continuation of the last semester course "Three-dimensional web-interfaces - new approaches in visualization, interaction and animation".

This semester we will explore (from the point of view of the user) the possible use of 3D in eCommerce- and eLearning-applications. In our research we will create prototype-based applications to define the potential between 2D and 3D visualization. How can we evaluate the experience of a user who is operating in a webshop. Are there any positiv/negativ effects when we visualize the products of the webshop in 3D in comparison to conventional 2D visualization (like picture-slideshows)?

And don't worry about the experimental character: most of the defined solutions can be transfered to the conventional two-dimensional web-development.

== Registration Procedure ==
To register for the course, please send an eMail due to April 5th with the Topic "Registration for {{PAGENAME}}" to Gabriel.Rausch (at) uni-weimar.de,
incuding the following informations:
* Full Name
* program and semester (Studienprogramm und Fachsemester)
* matriculation number (Matrikelnummer)
* Angabe der geltenden Prüfungsordnung (eg. PV27 or PV29)
* Valid email address @uni-weimar.de
* One short sentence why you want to (have to) be in this course (german or english)

If there are more than 15 registrations, students will be accepted depending on:
* Order (first come, first serve)
* If you are in a Project of Interface-Design (see Prof. Jens Geelhaar's semester projects this semester)
* What you've written in "why I want to be in this course"

If there are more than 20 registrations, there might be a kick-off event with an evaluation competition.

==Certificates of Achievements==
* Active and regular participation
* Progress on the individual project you are working on
* Creating a piece of work for an exhibition at the Summary
* 2 minute presentation at the [[IFD:Showreel]]
* Final Hand-in of your project/concept/...

==Target Audience==
* In general open to all students, but esp. suited for
* Bachelor- and Master students of Media-Arts & Design
* Master students Media-Architecture

==Syllabus==

* 07.04. Introduction & Study
** [https://dl.dropboxusercontent.com/u/22663277/Bosch%203D%20Images.zip Download Bosch 3D Images 800x450]
* 14.04. Cancled
* 28.04. Current State eCommerce Product Presentation, Product Definition
* 05.05. Hands On HTML5, Canvas & WebGL
* 12.05. Concept & Wireframes A-B-Application
* 19.05. Prototype Assembly I
* 26.05. Prototype Assembly II
* 02.06. Internal Test Scenario
* 16.06. Adjustments I
* 23.06. Adjustments II
* 30.06. Test Scenario Target Group
* 07.07. First Analysis
* 10. - 13.07. Summaery

==Participants==
[[Tobias Westphal]]

[[Alexander Vogt]]

IFD:GoingMobile/Kernberg-Horizontale

2014-04-23T09:12:33Z

Alex: /* Tuesday, April 22th, 2014 */

[[Image:SaaleHorizontale1.png|right|420px|link=http://www.komoot.de/tour/2608562]]
== Jena Saale Horizontale ==

The Saale Horizontale is a trail around Jena, crossing the dry and sunny mountain slopes. Jena is unique in having more than seven nature reserves in the city's nearest vicinity.

== Tuesday, April 22th, 2014 ==

'''Meeting Point 1:''' Hauptbahnhof Weimar, 13:15 from Platform 1.
* '''The train leaves at 13:21 as EB 80893 to Gera from Platform 1'''
* To get to the Hauptbahnhof:
** At least 25 minutes from the Uni to the Hauptbahnhof by foot
** or catch a bus at Goetheplatz

'''Meeting Point 2 Jena:''' Westbahnhof, Arrival: ~13.41, Platform 2
* [http://www.komoot.de/tour/2608944 Jena West to Jena Paradies]

'''Main Meeting Point 3 Jena Paradies:''' 13.50 - 14.00 at the rear entrance (to the Paradies Park)
* Paradiesbahnhof
** There are lockers (2,50 to 3,50 € per 24 hrs) if required
** There's a bakery inside the station for drinks & food (no refreshments on the way, sadly)

[[File:KernbergeTour.png|right|420px|link=http://www.komoot.de/tour/2608562]]
'''Tour''': http://www.komoot.de/tour/2608562 
* Teufelslöcher
* Kupferplatte
* Studentenrutsche
* Diebeskrippe
* Dietrichstein
** ''this is a short tour; if you feel up to the "real" tour, then I recommend you check this out: [http://www.komoot.de/tour/1069826 http://www.komoot.de/tour/1069826]''

'''Length/Duration:'''
* from/to Jena Paradies: 9,5 km, estimated 3:45 h (without stops)

Back to Weimar:
* 15 min walk from Jena Paradies to Jena West
* RE (~xx.38) or EB (~xx.16) back to Weimar Hbf

'''Things to pack''':
* Bottle of water
* Light rain jacket (just in case…)
* Appropriate footwear (really important, the trail at the Sonnenberghorizontale and the Lutherkanzel is narrow and steep!)

'''Weather''':
* It is expected to be a [http://www.wetter.de/deutschland/wetter-jena-18234574/wetterbericht-aktuell.html beautiful and mostly sunny day, but it still might be fresh in the shadows (~10 to ~19 °C)]
* '''IMPORTANT:''' In case of (severe) thunderstorms we will abort this field trip. Please check this site on Tuesday noon to see if there are any changes!

'''komoot-track (Alex)''':
*http://www.komoot.de/tour/t2627392?

[[Category:Michael Markert]]
[[Category:Excursion]]
[[Category:Going Mobile]]
[[Category:Jena]]

IFD:GoingMobile/Kernberg-Horizontale

2014-04-23T09:10:32Z

Alex: /* Tuesday, April 22th, 2014 */

[[Image:SaaleHorizontale1.png|right|420px|link=http://www.komoot.de/tour/2608562]]
== Jena Saale Horizontale ==

The Saale Horizontale is a trail around Jena, crossing the dry and sunny mountain slopes. Jena is unique in having more than seven nature reserves in the city's nearest vicinity.

== Tuesday, April 22th, 2014 ==

'''Meeting Point 1:''' Hauptbahnhof Weimar, 13:15 from Platform 1.
* '''The train leaves at 13:21 as EB 80893 to Gera from Platform 1'''
* To get to the Hauptbahnhof:
** At least 25 minutes from the Uni to the Hauptbahnhof by foot
** or catch a bus at Goetheplatz

'''Meeting Point 2 Jena:''' Westbahnhof, Arrival: ~13.41, Platform 2
* [http://www.komoot.de/tour/2608944 Jena West to Jena Paradies]

'''Main Meeting Point 3 Jena Paradies:''' 13.50 - 14.00 at the rear entrance (to the Paradies Park)
* Paradiesbahnhof
** There are lockers (2,50 to 3,50 € per 24 hrs) if required
** There's a bakery inside the station for drinks & food (no refreshments on the way, sadly)

[[File:KernbergeTour.png|right|420px|link=http://www.komoot.de/tour/2608562]]
'''Tour''': http://www.komoot.de/tour/2608562 
* Teufelslöcher
* Kupferplatte
* Studentenrutsche
* Diebeskrippe
* Dietrichstein
** ''this is a short tour; if you feel up to the "real" tour, then I recommend you check this out: [http://www.komoot.de/tour/1069826 http://www.komoot.de/tour/1069826]''

'''Length/Duration:'''
* from/to Jena Paradies: 9,5 km, estimated 3:45 h (without stops)

Back to Weimar:
* 15 min walk from Jena Paradies to Jena West
* RE (~xx.38) or EB (~xx.16) back to Weimar Hbf

'''Things to pack''':
* Bottle of water
* Light rain jacket (just in case…)
* Appropriate footwear (really important, the trail at the Sonnenberghorizontale and the Lutherkanzel is narrow and steep!)

'''Weather''':
* It is expected to be a [http://www.wetter.de/deutschland/wetter-jena-18234574/wetterbericht-aktuell.html beautiful and mostly sunny day, but it still might be fresh in the shadows (~10 to ~19 °C)]
* '''IMPORTANT:''' In case of (severe) thunderstorms we will abort this field trip. Please check this site on Tuesday noon to see if there are any changes!

'''komoot-track (Alex)''':
*http://www.komoot.de/tour/t2627392

[[Category:Michael Markert]]
[[Category:Excursion]]
[[Category:Going Mobile]]
[[Category:Jena]]

IFD:GoingMobile/Kernberg-Horizontale

2014-04-23T09:08:35Z

Alex: /* Tuesday, April 22th, 2014 */

[[Image:SaaleHorizontale1.png|right|420px|link=http://www.komoot.de/tour/2608562]]
== Jena Saale Horizontale ==

The Saale Horizontale is a trail around Jena, crossing the dry and sunny mountain slopes. Jena is unique in having more than seven nature reserves in the city's nearest vicinity.

== Tuesday, April 22th, 2014 ==

'''Meeting Point 1:''' Hauptbahnhof Weimar, 13:15 from Platform 1.
* '''The train leaves at 13:21 as EB 80893 to Gera from Platform 1'''
* To get to the Hauptbahnhof:
** At least 25 minutes from the Uni to the Hauptbahnhof by foot
** or catch a bus at Goetheplatz

'''Meeting Point 2 Jena:''' Westbahnhof, Arrival: ~13.41, Platform 2
* [http://www.komoot.de/tour/2608944 Jena West to Jena Paradies]

'''Main Meeting Point 3 Jena Paradies:''' 13.50 - 14.00 at the rear entrance (to the Paradies Park)
* Paradiesbahnhof
** There are lockers (2,50 to 3,50 € per 24 hrs) if required
** There's a bakery inside the station for drinks & food (no refreshments on the way, sadly)

[[File:KernbergeTour.png|right|420px|link=http://www.komoot.de/tour/2608562]]
'''Tour''': http://www.komoot.de/tour/2608562 
* Teufelslöcher
* Kupferplatte
* Studentenrutsche
* Diebeskrippe
* Dietrichstein
** ''this is a short tour; if you feel up to the "real" tour, then I recommend you check this out: [http://www.komoot.de/tour/1069826 http://www.komoot.de/tour/1069826]''

'''Length/Duration:'''
* from/to Jena Paradies: 9,5 km, estimated 3:45 h (without stops)

Back to Weimar:
* 15 min walk from Jena Paradies to Jena West
* RE (~xx.38) or EB (~xx.16) back to Weimar Hbf

'''Things to pack''':
* Bottle of water
* Light rain jacket (just in case…)
* Appropriate footwear (really important, the trail at the Sonnenberghorizontale and the Lutherkanzel is narrow and steep!)

'''Weather''':
* It is expected to be a [http://www.wetter.de/deutschland/wetter-jena-18234574/wetterbericht-aktuell.html beautiful and mostly sunny day, but it still might be fresh in the shadows (~10 to ~19 °C)]
* '''IMPORTANT:''' In case of (severe) thunderstorms we will abort this field trip. Please check this site on Tuesday noon to see if there are any changes!

'''komoot-track (Alex)''':
*http://www.komoot.de/tour/t2627392*

[[Category:Michael Markert]]
[[Category:Excursion]]
[[Category:Going Mobile]]
[[Category:Jena]]

IFD:GoingMobile/Janet Cardiff Soundwalk, Cospeda

2014-04-17T07:34:03Z

Alex: /* Wednesday, April 16th, 2014 */

[[File:Windknollen.jpg|right|420px]]
== Jena Cospeda ==

The Windknollen is a nature reserve area north west of Jena residing on the hills around Jena. There have been severe battles between Napoleon's and Prussian troops.

The Canadian artist Janet Cardiff created one of her unique soundwalks across these battlefields of 1806.

== Wednesday, April 16th, 2014 ==

'''Meeting Point 1:''' Hauptbahnhof Weimar, 13 / 1pm SHARP at the Platform 2.
* '''The train leaves at 13:05 as RE 3707/3627 from Platform 2'''
* To get to the Hauptbahnhof:
** At least 25 minutes from the Uni to the Hauptbahnhof by foot
** or catch the bus #6 leaving around 12.4x (?) from Wielandplatz

'''Meeting Point 2 Jena:''' Westbahnhof, Arrival: ~13.21, Platform 2

'''Meeting Point 3 [https://www.google.de/maps/dir/Weimar/Hotel+%26+Braugasthof+Papierm%C3%BChle,+Erfurter+Stra%C3%9Fe+102,+07743+Jena/@50.9728894,11.4714209,11z/data=!4m19!4m18!1m5!1m1!1s0x47a41aec0bb0aa01:0x3f9f0db5e1b29abd!2m2!1d11.326458!2d50.991487!1m5!1m1!1s0x47a6a880b9b4fb5b:0x36da358cb94e013e!2m2!1d11.557931!2d50.937302!2m4!4e2!5e0!5e2!5e3!3e3 Jena/Papiermühle]:''' ~13.50 plus/minus one Bus
* Bus via Line 16 from "Holzmarkt/Stadtzentrum" to "Mühltal" or via Line 14 from "Volkshaus" to "Langetal",
** see: [http://www.öpnvkarte.de ÖPNV (Public Transport Map)] 
** see: [http://www.jenah.de/fileadmin/user_upload/VMT/2012/Haltestellenuebersicht_Stadtzentrum.pdf Haltestellen Jena]
** see: [http://www.jenah.de/fileadmin/user_upload/Material/2013/NP_Jena_03_A4.pdf Netzplan Jena]

[[File:CospedaTour.png|right|420px|link=http://www.komoot.de/tour/2523580#]]
'''Tour''': http://www.komoot.de/tour/2523580# 
* '''~45 min walk to the [http://www.jena1806.de Musum 1806]''' in Cospeda via Sonnenberghorizontale and Windknollen
* '''[http://www.cardiffmiller.com/artworks/walks/jena.html Memory Walk]''' (Sound Walk) from Janet Cardiff
* '''~25 min walk''' back via Lutherkanzel

Back to Weimar:
* Bus (or ~45 min walk) back to Jena West
* RE or RB back to Weimar Hbf

'''Things to pack''':
* Bottle of water
* Light rain jacket (just in case…)
* Appropriate footwear (really important, the trail at the Sonnenberghorizontale and the Lutherkanzel is narrow and steep!)
* Custom headphones for the sound walk (if you prefer good ones)
* 1,50 € in coins (audio walk fee)
* An ID card as deposit
* Student card to use the train and the bus

'''Weather''':
* It is expected to be a [http://www.wetter.de/deutschland/wetter-jena-18234574/wetterbericht-aktuell.html beautiful and sunny day, but not very warm (only ~10 °C)]

'''komoot-track (Alex)''':
*http://www.komoot.de/tour/t2570368

[[Category:Going Mobile, Exkursion, SS14]]

IFD:GoingMobile/Janet Cardiff Soundwalk, Cospeda

2014-04-17T07:33:40Z

Alex: /* Wednesday, April 16th, 2014 */

IFD:Mobile Apps with HTML5/Alex

2013-12-03T09:35:14Z

Alex:

== 1. Assignment ==

[[File:Favicon_kafka_alex.png‎|20px]]
[http://onezeronine.com/webapp/kafka/ Kafka] - completed example from 13-10-29 with Kafkas "Die Verwandlung (+native JavaScript)

[[File:Favicon_pictures_alex.png‎|20px]]
[http://onezeronine.com/webapp/picture/ pictures] - simple image-stack in pure HTML & CSS (keyframe-animation)

== 2. Assignment ==

[[File:Favicon_zeit_alex.png‎|20px]]
[http://onezeronine.com/webapp/Zeit/ TIMEone] - current time visualized by drawing circles and/or bars (values define size and/or color-opacity)

[[File:Favicon_zeit2_alex.png‎|20px]]
[http://onezeronine.com/webapp/Zeit2/ TIMEtwo] - current time visualized in text-format with changing header image, depending on the time of the day (sunrise, noon, ...)

== 3. Assignment ==

[[File:Favicon_jsdict_alex.png‎|20px]]
[http://onezeronine.com/webapp/dictionary/ JavaScript Dictionary] - completed example from 13-11-19 (values are displayed in div instead of console & some CSS-styling)

== 4. Assignment ==

[[File:Favicon_typewriter_alex.png‎|20px]]
[http://onezeronine.com/webapp/typewriter/ FakeTypewriter] - Goethe's "Werther" written on a broken typewriter, character by character (by click(mouse) oder touch(mobile))

File:Favicon typewriter alex.png

2013-12-02T22:15:19Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:Mobile Apps with HTML5/Alex

2013-12-02T22:10:56Z

Alex:

== 1. Assigment ==

[[File:Favicon_kafka_alex.png‎|20px]]
[http://onezeronine.com/webapp/kafka/ Kafka] - completed example from 13-10-29 with Kafkas "Die Verwandlung (+native JavaScript)

[[File:Favicon_pictures_alex.png‎|20px]]
[http://onezeronine.com/webapp/picture/ pictures] - simple image-stack in pure HTML & CSS (keyframe-animation)

== 2. Assigment ==

[[File:Favicon_zeit_alex.png‎|20px]]
[http://onezeronine.com/webapp/Zeit/ TIMEone] - current time visualized by drawing circles and/or bars (values define size and/or color-opacity)

[[File:Favicon_zeit2_alex.png‎|20px]]
[http://onezeronine.com/webapp/Zeit2/ TIMEtwo] - current time visualized in text-format with changing header image, depending on the time of the day (sunrise, noon, ...)

== 3. Assigment ==

[[File:Favicon_jsdict_alex.png‎|20px]]
[http://onezeronine.com/webapp/dictionary/ JavaScript Dictionary] - completed example from 13-11-19 (values are displayed in div instead of console & some CSS-styling)

== 4. Assigment ==

[[File:Favicon_typewriter_alex.png‎|20px]]
[http://onezeronine.com/webapp/typewriter/ FakeTypewriter] - Goethe's "Werther" written on a broken typewriter, character by character (by click(mouse) oder touch(mobile))

IFD:Mobile Apps with HTML5/Alex

2013-12-02T21:18:43Z

Alex:

File:Favicon jsdict alex.png

2013-11-25T18:59:01Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:Mobile Apps with HTML5/Alex

2013-11-25T18:57:30Z

Alex:

IFD:Mobile Apps with HTML5/Alex

2013-11-18T20:04:06Z

Alex:

File:Favicon zeit2 alex.png

2013-11-18T20:03:05Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:Favicon zeit alex.png

2013-11-18T20:02:33Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:Mobile Apps with HTML5/Alex

2013-11-18T15:17:07Z

Alex:

File:Favicon pictures alex.png

2013-11-18T15:09:06Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:Mobile Apps with HTML5/Alex

2013-11-18T15:08:11Z

Alex:

File:Favicon kafka alex.png

2013-11-18T15:03:54Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:Mobile Apps with HTML5/Alex

2013-11-18T15:02:36Z

Alex:

== 1. Assigment ==

[http://onezeronine.com/webapp/kafka/ Kafka] - completed example from 13-10-29 with Kafkas "Die Verwandlung (+native JavaScript)

[http://onezeronine.com/webapp/picture/ pictures] - simple image-stack in pure HTML & CSS (keyframe-animation)

== 2. Assigment ==

...uploading....

IFD:Mobile Apps with HTML5/Alex

2013-11-11T16:08:56Z

Alex:

uploading...

[http://onezeronine.com/webapp/kafka/ Kafka] - completed example datef from 13-10-29 with Kafkas "Die Verwandlung (+native JavaScript)

[http://onezeronine.com/webapp/picture/ pictures] - simple image-stack in pure HTML & CSS (keyframe-animation)

IFD:Mobile Apps with HTML5/Alex

2013-11-11T16:05:44Z

Alex:

uploading...

[http://onezeronine.com/webapp/kafka/ Kafka] - completed example datef from 13-10-29 with Kafkas "Die Verwandlung (+native JavaScript)

[http://onezeronine.com/webapp/picture/ picture] - simple image-stack in pure HTML & CSS (keyframe-animation)

IFD:Mobile Apps with HTML5/Alex

2013-11-11T15:56:30Z

Alex: Created page with "uploading..."

uploading...

IFD:Mobile Apps with HTML5

2013-11-11T15:56:08Z

Alex: /* Student Projects */

[[Image:ProcodingMobile.png|right|400px]]
[[:Category:Werkmodul|Werkmodul]] | [[:Category:Fachmodul|Fachmodul]] 
''Lecturer:'' [[Michael Markert]] 
''Credits:'' 6 [[ECTS]], 3 [[SWS]] 
''Date:'' Tuesdays, 13:30 until 16:00 h 
''Venue:'' [[Marienstraße 7b]], Room 105 
''First meeting:'' Tuesday, 22. October 2013

==Beschreibung==

Wolltest du schon immer eine App für dein iPhone erstellen? Oder hast du eine tolle Idee für ein "''Creative Coding Experience''" auf deinem iPad? Hast du ein neues Android Tablett und möchtest etwas schickes damit machen? Das ist deine Chance!

Wir werden mit den neuesten cross-platform HTML5 Web-Technologien arbeiten (hauptsächlich mit der ECMA Scriptsprache, besser bekannt als JavaScript; inklusive CSS3), um Apps zu erstellen, die auf deinem internetfähigen mobilen Endgerät laufen.

Themen:
* siehe englische Auflistung

Dieser Kurs wird je nach Bedarf höchstwahrscheinlich auf Englisch abgehalten.

'''Hinweis:''' Wer mit mehreren Endgeräten und Web-Synchronisation arbeiten will, dem wird der gleichzeitige Besuch des Werk-/Fachmoduls von Kollege Gabriel Rausch empfohlen, das auch auf Serverseitige Programmierung eingeht. Aus zeitlichen Gründen können wir das in diesem Kurs nicht tun.

==English description==

Did you ever wish to design an app for your iPhone? Or do you have an idea for this nice creative coding experience on your iPad? Do you have a new Android Tablet and want to make something cool with it? This is your chance!

We will work with the latest cross-platform HTML5 web technologies (mainly the ECMA scripting language, better known as JavaScript; including CSS3) to create applications that will run on your mobile device.

Topics will be:
* Creative Coding on mobile devices
* Introduction to Programming
** Variables
** Functions / Methods
** Objects
** Events
** Best practices and Software Design Patterns (Accessors: Getters/Setters, Creating Objects, Modules…)
* ECMA Script (JavaScript)
* CSS3 (Design, Animation, Transition…)
* HTML5 (Multitouch, Geolocation, Device Orientation, Local Storage, Canvas, WebAudio, SVG...)
* Communication Protocols (JSON, AJAX with XMLHttpRequest), using the API of WebServices (Google, FlickR, Twitter, Yahoo Pipes, Facebook...)
* JavaScript Libraries (Processing.js, Paper.js, D3.js, jQuery Mobile and many more…)
* Webapps and Hybrid Apps (that's a webApp that is wrapped in a native application that you can download from an app store)

This course will most likely be held in English

==Requirements==
* Your own computer (Laptop) with a proper plain text code editor
* Your own mobile device that's capable of browsing the internet
* If you have a computer running Mac OS X 10.7 or newer, you'll get a free copy of [http://procoding.audiocommander.de Procoding]
* If you have an iPhone, iPad or iPod Touch running iOS 7 or newer, you'll get a free copy of [http://procoding.audiocommander.de Procoding Mobile]
* Procoding is not required, if you have another system, you'll get a starter package that you can edit with the code editor of your choice.

== Registration Procedure ==


THE COURSE IS FULL. NO MORE REGISTRATIONS ACCEPTED.

== Assignment ==
* Regular and active participation
* Working on the weekly assignments and documenting them in this Wiki
* Presentation of your work in progress in the course
* Presentation of your work at the [[IFD:Showreel]]
* Final hand-in (in this Wiki) with short documentation at the end of the term

== Student Projects ==
Please copy this first entry (NameOrPseudonym) and make your own subpages:
* That's what the Wiki-Code means:
** The first two brackets create a infernal link in this wiki (this creates a new page).
** The slash "/" makes the page a subpage of this page

* [[/NameOderPseudonym]] <-- Please '''''copy''''' this link and use your own name (this is a public wiki!).
* [[/Charlotte]]
* [[/mantik]]
* [[/Anastasiya Pavelchuk]]
* [[/Sabina]]
* [[/Xianzhi]]
* [[/MartinMelcher]]
* [[/NataSuu]]
* [[/YorGarcia]]
* [[/AndrésArteaga]]
* [[/Bastiny]]
* [[/Julia]]
* [[/Jano]]
* [[/ElMerino]]
* [[/Apasri]]
* [[/Alex]]

'''Btw:''' 
[[Help:Editing|Help]] shows how to edit in this wiki; [[Help:Images|How to upload and use images]]. Please do not upload content that you did not create.

== Eligible participants ==
* Bachelor Students Media Art & Design
* Master Students Media Art & Design
* Master Students MediaArchitecture
* All others: if you're interested, get in contact with Michael!

==Syllabus==
Preliminary schedule:
# 22.10. First meeting, Intro & Showcase
# 29.10. HTML, CSS & jQuery Mobile
# <del>05.11. no class</del> due to an excursion!
# 12.11. CSS, JavaScript (ECMA): Variables & Functions
# 19.11. Objects
# 26.11. Event Handlers (Drawing with a Touch)
# 03.12. Networking (XMLHttpRequest), Yahoo Pipes (XML to JSON)
# 10.12. Geolocation & Device Orientation
# 17.12. Communication Part II (FlickR API)
# 07.01. SVG
# 14.01. JS Libs Part I
# 21.01. JS Libs Part II
# 28.01. Hybrid Apps Part I
# 04.02. Hybrid Apps Part II
# 31.03. tba

== Links ==

* [http://procoding.audiocommander.de Procoding]

== Literature ==
Beginners:
* Marijn Haverbeke: Die Kunst der JavaScript Programmierung (DE) / Eloquent JavaScript (EN), ISBN 9873898647878, http://marijnhaverbeke.nl
* Florian Franke: Apps mit HTML5 und CSS3: für iPad, iPhone und Android (DE), ISBN 978-3836218481

Advanced:
* Stoyan Stefanov: O'Reilly JavaScript Patterns, ISBN 978-0596806750

Processing and Processing.js:
* Daniel Shiffman: Pixels, Patterns, and Processing: A Beginner's Guide to Programming Images, Animation, and Interaction, ISBN 978-0123736024
* Daniel Shiffman: The Nature of Code: Simulating Natural Systems with Processing, ISBN 978-0985930806, http://natureofcode.com

[[Category:Courses]]
[[Category:CSS]]
[[Category:Cocoa]]
[[Category:Computer graphics]]
[[Category:Design]]
[[Category:GPS]]
[[Category:GUI]]
[[Category:Generative Gestaltung]]
[[Category:Gestaltung]]
[[Category:Grundlagen]]
[[Category:HTML]]
[[Category:IDE]]
[[Category:IFD]]
[[Category:IOS]]
[[Category:IPad]]
[[Category:IPhone]]
[[Category:IPodTouch]]
[[Category:Interaktion]]
[[Category:Internet]]
[[Category:Michael Markert]]
[[Category:Mobile Development]]
[[Category:Mobile Interfaces]]
[[Category:Objective-C]]
[[Category:Processing]]
[[Category:Programmiersprachen]]
[[Category:WS13]]
[[Category:Webtechnologien]]
[[Category:Werkmodul]]
[[Category:Xcode]]
[[Category:Javascript]]
[[Category:Fachmodul]]

IFD:ShowreelSS13/Moritz Dreßler + Alexander Vogt - Integrated Printed Electronics in Wallpapers

2013-07-12T15:57:40Z

Alex:

==Concept for integrated printed electronics in wallpapers using the example of dynamic exit route borders==
===Moritz Dreßler | Alexander Vogt===
====Projekt 'Interface Design 4 / Interaction and Experimental Interfaces “From Objects to Space: Printed Electronics & Light”'====
[[File:ifd_wallpaper_09.jpg]]
[[File:ifd_wallpaper_07.jpg]]
[[File:ifd_wallpaper_04.jpg]]
[[File:ifd_wallpaper_02.gif]]
[[File:ifd_wallpaper_05.jpg]]
[[File:ifd_wallpaper_03.gif]]
[[File:ifd_wallpaper_06.jpg]]

IFD:ShowreelSS13/Alexander Vogt - RGB TV

2013-07-12T12:41:58Z

Alex:

==RGB TV - Color Analysing & Visualisation==
===Alexander Vogt===
====Fachmodul 'Tangible Programming - An Introduction II'====
[[File:RGBTV-1.jpg]]
[[File:RGBTV-2.jpg]]
[[File:RGBTV-3.jpg]]
[[File:RGBTV-4.jpg]]
[[File:RGBTV-5.jpg]]
[[File:RGBTV-6.jpg]]
[[File:RGBTV-7.jpg]]
[[File:RGBTV-8.jpg]]
[[File:RGBTV-9.jpg]]
[[File:RGBTV-10.jpg]]
[[File:RGBTV-11.jpg]]
[[File:RGBTV-12.jpg]]
[[File:RGBTV-13.jpg]]
[[File:RGBTV-14.jpg]]

File:RGBTV-14.jpg

2013-07-12T12:41:31Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-13.jpg

2013-07-12T12:41:16Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-12.jpg

2013-07-12T12:41:05Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-11.jpg

2013-07-12T12:40:55Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-10.jpg

2013-07-12T12:40:45Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-9.jpg

2013-07-12T12:40:36Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-8.jpg

2013-07-12T12:40:03Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-7.jpg

2013-07-12T12:39:50Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-6.jpg

2013-07-12T12:39:22Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-5.jpg

2013-07-12T12:39:12Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-4.jpg

2013-07-12T12:38:57Z

Alex:

== Summary ==

== Copyright status: ==

== Source: ==

File:RGBTV-3.jpg

2013-07-12T12:38:42Z

Alex: