Atlassian uses cookies to improve your browsing experience, perform analytics and research, and conduct advertising. Accept all cookies to indicate that you agree to our use of cookies on your device. Atlassian cookies and tracking notice, (opens new window)
Confluence
For you

Basic GUI
Results will update as you type.
  • Basic GUI 2019
  • Basic GUI 2018
  • Basic GUI 2017
  • Basic GUI FS16
  • Basic GUI FS16 Tech
  • Basic GUI FS17 Tech

    Two hearts overlapped with each other
    Welcome back
    Catch up on the top discussions and highlights from your team.
    /
    Basic GUI 2019
    Updated May 23, 2019

    Basic GUI 2019

    May 23, 2019

    Analytics

    Loading data...

    The module Basic GUI includes two courses. One course is "Web Technologies" and the other is "Basic GUI" project course. 

    Link to course overview: "Web Technologies"

    Lecturers

    • Prof. Jürgen Späth

    • Martin Dusek

    • Jonas Scheiwiller

    Students

    01 Sophie Anderhub, 02 Adrienn Bador-Pek, 03 Damaris Büchner, 04 Andreas Bütler, 05 Roman Engler, 06 Fabian Frey, 07 Tim Fuchs, 08 Andreas Fürer, 09 Andy Kirk, 10 Yao Liu, 11 Sonjoi Nielsen, 12 Shafira Maharani Nabilia Nugroho, 13 Paméla Schmidinger, 14 Yangzom Sharlhey, 15 Danuka Ana Tomas, 16 Tamara Trabucco, 17 Zoë Urand

    Groups

    3 x 3 Students, 2 x 4 Students

    Gruppe 01: Sophie Anderhub, Yao Liu, Shafira Nugroho
    Gruppe 02: Roman Engler, Tamara Trabucco, Paméla Schmidinger
    Gruppe 03: Zoe Urand, Fabian Frey, Damaris Büchner, Yangzom Sharlhey
    Gruppe 04: Andreas Fürer, Danuka Tomas, Andy Kirk
    Gruppe 05: Andreas Bütler, Sonjoi Nielsen, Adrienn Bador-Pek, Tim Fuchs

    Period

    12th of April – 7th of June

    Attendence

    In the contact hours a minimum attendance of 80% is required to pass the module. Contact hours: classes, kick-off, input session, mentoring, presentation 

    Module valuation key

    Web Technologies: 25%
    Basic GUI project: 75%

    Basic GUI project

    Over the course of five weeks, students will redesign the interface of the ITZ Leihs system. Leihs is an open source equipment booking and inventory management system. 







    Cooperation Partner

    ZHdK Informationstechnologie-Zentrum (ITZ)

    • Nadja Weisskopf – Product Owner Leihs

    • Barbara Berger – Leitung ITZ

    Institutions use Leihs

    • ZHdK Zürcher Hochschule der Künste

    • HKB Hochschule der Künste Bern

    • ZHAW Zürcher Hochschule für Angewandte Wissenschaften

    • F+F Schule für Kunst und Design

    • Universität Basel

    • Hochschule Luzern – Design & Kunst

    • HTW Hochschule für Technik und Wirtschaft Chur

    • PHZH Pädagogische Hochschule Zürich

    • HEIG-VD School of Business and Engineering Vaud – Yverdon-les-Bains

    • Ringier

    • Staatliche Hochschule Für Musik Trossingen

    • FH Vorarlberg

    • University of Applied Sciences Europe – Berlin

    • KONSTFACK University of Arts, Crafts and Design – Stockholm

    • University of Brighton

    • University of Worcester

    • Middle Tennessee State University

    Institutions plan to use Leihs

    • ETH Zürich – end of 2019

    • Schule für Gestaltung Bern und Biel – end of 2019

    • Willem de Kooning Academy 
Rotterdam University of Applied Sciences – end of 2019

    • Stadtpolizei Zürich – end of 2019

    Phases

    Explore 

    The explore phase helps us to get to know the user and to grasp his needs, preferences and decision-making principles. Only when we know our user well and have really understood his problems, we can develop an idea and later a product that convinces and excites him.

    • Desk Research, Field research, Interviews, extremely users interviews 


    Create

    • Brainstorming, Mind Mapping, Sketching, etc.
      Take one or more of the above methods to rethink the scenario. Be "wild" and come back with innovative and striking solutions of which you hadn't thought of before.


    • Wireframe Screen Flow Diagram, Mood board
      Draw individual screen wireframes that are connected with each other to show the flow in your application. Traditionally, the mood board is a big collage consisting of photos, apps, texts, illustrations and other materials that show the look and feel. The mood board shows links between the things and supports the imagination of new ways.


    • Design GUI
      Using the mood board, a skin for the application is developed. Software: Photoshop, Illustrator, Sketch, Adobe XD, etc.


    • Click-Dummy
      A clickable mockup of the final UI. Software: Flinto, Framer, Origami, Invision, Principle, Flinto, Adobe XD, etc.


    Evaluate

    • User-test
      The Click-Dummy is tested with three test users that solve a typical exercise. They are filmed and asked to think aloud while using the app.

    Deliverables

    See the IAD documentation guidelines for the standard material.

    • Documentation; format: PDF

    • Video / Screencast; add the IAD intro and closing credits to your videos

    • Video / User-test

    • Images (Screenshots & Usage Scenarios); approx. 10 representative images of the project

    • Text (project title, short description, project description)

    • Click-Dummy

    All deliverables have to be uploaded to the filer until Monday 10.06.2019 at 9 am.

    Grading

    Grades will be based on final presentation, final work, deliverables.

    Final presentation: 20%

    Final work (Concept, GUI, Click-dummy): 50%

    Deliverables: 30%

    Downloads & Links

    Slides Kick-Off

    Digital Innovation Playbook

    Schedule

    This schedule is not final. Changes reserved.

    Week 1

    Tuesday 09.04.

    Wednesday 10.04.

    Thursday 11.04.

    Friday 12.04.

    Week 1

    Tuesday 09.04.

    Wednesday 10.04.

    Thursday 11.04.

    Friday 12.04.

    Morning









    Web Technologies
    JSC - 4.K15 (09.30-12.00)

    Afternoon









    Week 2

    Tuesday 16.04.

    Wednesday 17.04.

    Thursday 18.04.

    Friday 19.04.

    Morning







    Public Holiday

    Afternoon







    Week 3

    Tuesday 22.5

    Wednesday 23.5

    Thursday 24.5

    Friday 25.5

    Morning









    Afternoon









    Week 4

    Tuesday 23.04.

    Wednesday 24.04.

    Thursday 25.04.

    Friday 26.04.

    Morning









    Afternoon









    Week 5

    Tuesday 30.04.

    Wednesday 01.05.

    Thursday 02.05.

    Friday 03.05.

    Morning



    Public Holiday



    Web Technologies
    JSC - 4.E08 (09.30-17.00)

    Afternoon







    Week 6

    Tuesday 07.05.

    Wednesday 08.05.

    Thursday 09.05.

    Friday 10.05.

    Morning

    Web Technologies
    JSC - 4.E08 (09.00-17.00)

    Basic GUI | Kick-Off
    JSP, MDU - 5.D02 (09.00-11.00)

    Analysis Leihs, Interviews

    Mentoring
    JSP - 4.T48 (09.00-12.00)

    Afternoon

    Desk Research, Analysis Leihs



    Findings

    Week 7

    Tuesday 14.05.

    Wednesday 15.05.

    Thursday 16.05.

    Friday 17.05.

    Morning

    Brainstorming, Mind Mapping, Sketching, etc.

    Input Wireframe Screen Flow Diagram
    JSP - 4.K14 (09.00-10.00)

    Mentoring
    JSP, MDU - 4.E08 (10.00-12.00)

    Web Technologies
    JSC - 4.D12 (09.00-17.00)

    Wireframe Screen Flow Diagram, Wireframe Click-Dummy

    Afternoon

    Input Prototyping/Click-Dummy
    MDU - 4.K14 (13.00-14.00)

    Brainstorming, Mind Mapping, Sketching, etc.

    Wireframe Screen Flow Diagram

    Mentoring
    MDU - 5.D02 (13.00-17.00)

    Week 8

    Tuesday 21.05.

    Wednesday 22.05.

    Thursday 23.05.

    Friday 24.05.

    Morning

    Wireframe Click-Dummy



    Input GUI Design
    JSP - 4.E08 (09.00-10.00)

    Mentoring
    JSP, MDU - 4.E08 (10.00-12.00)

    Web Technologies
    JSC - 4.D12 (09.00-17.00)

    GUI Design

    Afternoon

    GUI Design

    Mentoring
    JSP - 5.T04 (14.30-17.00)

    Week 9

    Tuesday 28.05.

    Wednesday 29.05.

    Thursday 30.05.

    Friday 31.05.

    Morning

    Mid-Presentation
    JSP, MDU - 4.T48 (10.00-12.00)

    Mentoring
    JSP, MDU - 4.T48 (09.00-12.00)

    Public Holiday

    Web Technologies
    JSC - 4.T07 (09.00-17.00)

    Afternoon

    GUI Design Click-Dummy

    User test Click-Dummy; Thinking Aloud Methode

    Week 10

    Tuesday 04.06.

    Wednesday 05.06.

    Thursday 06.06.

    Friday 07.06.

    Morning

    Mentoring
    JSP, MDU - 3.E03 (10.00-12.00)

    Revision Click-Dummy after user test

    Preparing presentation

    Feedback Session
    JSP, MDU - 4.D12 (10.00-12.00)

    Afternoon

    Revision Click-Dummy after user test

    Preparing presentation

    Final Presentation
    JSP, MDU - 4.E08 (14.00-17.00)

    Dokumentation, Film/Screencast, Bilder/Screens, Text

    JSP: Jürgen Späth, MDU: Martin Dusek, JSC: Jonas Scheiwiller

















    {"serverDuration": 33, "requestCorrelationId": "3f46bdb5f4394992b39d7d70ae05c115"}