Incom ist die Kommunikations-Plattform der Hochschule Augsburg Gestaltung

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Hochschule Augsburg Gestaltung mehr erfahren

Mhuka_John (Block II)

Interactive Designs

Drehen/Spinning

Az656gG0RR.gifAz656gG0RR.gif

Very simple miniature featuring 2 tori which can freely be rotated using the mouse (no clicks required). The rotations of both tori are individual from on another. The smaller torus is always facing the user whilst the outer torus rotates around the centre of the smaller torus.

Drücken/Press

TwEtcLwDEF.gifTwEtcLwDEF.gif

At the beginning there is just a red cube being rotated around its y-axis. With a simple click one can spawn a torus and another cube and also add a X-axis rotation to the original cube whilst simultaneously making the original cube and the newly spawned objects transparent.

Ziehen / Drücken (Matter.js)

iU6cwcjSQD.gifiU6cwcjSQD.gif

Through matter.js a range of new user interaction capabilities are now available. The user can spawn in as many squares as possible and can interact with the already available by spawning a square and keeping the left mouse button held which will result in some interesting and fun collisions between the objects

CircleClock v1

jXUBz9vHGp.gifjXUBz9vHGp.gif

A simple user controlled clock. 

black circles represents every 10 seconds and the whole height of the screen is 1 minute. 

By clicking on the canvas the user can move the ball with the red outline (the second counter) up towards y=0/y=-800px

Link: https://www.hs-augsburg.de/homes/jtmhuka/IGestaltung/CircClock/

TriangelClock

ncyYJp5RxY.gifncyYJp5RxY.gif

Large triangle  represents the minute hand.

Small triangle with outline represents the second hand.

User moves both hands (triangle) by clicking their mouse. The large hand rptates at 1/6 the speed of smaller triangle which helps create a more complete sense of time/a clock. The motion blur just further adds to the effect.

https://www.hs-augsburg.de/homes/jtmhuka/IGestaltung/TricClock/

CircleClock v2

xvTyzbpnub.gifxvTyzbpnub.gif

CircleClock v2 now features and visual progress feedback in how the circle grows over time/as the user clicks their left mouse button. 

In progress: 

->Level Progression feedback.

->Design elements.

CircleClockV2

CircleClock Final

y4qTHRD4Ga.gify4qTHRD4Ga.gif

The Final version of the circle clock now features a particle system which is bound to each level (black circle) of the program.

The generated particles are only generated when a certain level on the -y-Axis has been reached by the Circle Clock Pointer (Red Outline).

Circle Clock Final

Ein Projekt von

Fachgruppe

Interaktive Medien

Art des Projekts

Keine Angabe

Zugehöriger Workspace

IA Grundlagen Interaktiver Gestaltung (Gruppe B)

Entstehungszeitraum

Sommersemester 2021