ui/ux design and architecture: leveraging web technologies for and by architects

Post on 11-Apr-2017

71 Views

Category:

Design

1 Downloads

Preview:

Click to see full reader

TRANSCRIPT

Dzgn.IOA217

UI/UX Design & ArchitectureUIUX_BP17

Eddy Man Kim & Rehan ButtApril 5, 2017

Credit(s) earned on completion of this course will be reported to AIA CES for AIA members. Certificates of Completion for both AIA members and non-AIA members are available upon request.

This course is registered with AIA

CES for continuing professional education. As such, it does not include content that may be deemed or construed to be an approval or endorsement by the AIA of any material of construction or any method or manner ofhandling, using, distributing, or dealing in any material or product.___________________________________________Questions related to specific materials, methods, and services will be addressed at the conclusion of this presentation.

This presentation is protected by US and International Copyright laws. Reproduction, distribution, display and use of the presentation without

written permission of the speaker is prohibited.

© Dzgn.IO 2017

Copyright Materials

Hello

Dzgn.IO Co-founders

Eddy Man Kim

Assistant Teaching Professor

Co-Director, Computational Design (Code) Lab

Chair, Master of Tangible Interaction Design (MTID) Program

Carnegie Mellon University School of Architecture

Rehan Butt

Master of Tangible Interaction Design (MTID) Student

Carnegie Mellon University School of Architecture

It is high time architects are critical of the standard suite of digital design and communication tools that are being used in practice. These tools are typically outdated, immobile, heavy-handed, over-wrought with features, and difficult to learn. Meanwhile, web technologies are developing at a phenomenal pace and are proving to be efficiently scalable and reliable at all scales of application. This course will provide a comprehensive overview of web technologies and discuss the merits of their application in architectural design practice. More specifically, the course will identify opportunities to create early design or pre-design tools to forge new design communication interfaces. On a conceptual level, the course will discuss the parallels between traditional understanding of architectural design practice and the emerging principles of UI/UX design for digital experiences on the web.

CourseDescription

LearningObjectives

1. Learn the basics and the broader landscape of web design and development, and how they affect the design profession at large.

2. Learn how traditional architectural concepts and workflows can be applied to designing digital experiences, and vice versa.

3. Gain an “under-the-hood” understanding of dynamic digital experiences to projectively imagine the role of architects in the future.

4. Learn how to continue exploring the realm of UI/UX design beyond this course; what resources are out there and how to find them.

At the end of the this course, participants will be able to:

UI/UX?

Design- Interaction Design- Information Architecture- Visual Design- Information Design- Technical Communication- Service Design

Research- User Research- Accessibility- Human Factors / Ergonomics

Strategy- UX Strategy (Business Goals)- Content Strategy- Customer Experience

User Interface / User Experience

UI/UX?

Design- Interaction Design- Information Architecture- Visual Design- Information Design- Technical Communication- Service Design

Research- User Research- Accessibility- Human Factors / Ergonomics

Strategy- UX Strategy (Business Goals)- Content Strategy- Customer Experience

User Interface / User Experience

Why UI/UX?

Sandbox3D:Real-time Design Collaboration

Concepts to consider between UX Design & Architecture

Structural Elements

http://homequity.us/planhouse/villa_savoye_house_plans.html

Analytics

https://monetizepros.com/encyclopedia/heat-map/http://www.retailerin.com/images/features/heatmap.png

Material Library /Style Guides

https://designmodo.com/create-style-guides/https://www.uh.edu/news-events/stories/2011articles/Sept2011/0912MRC.php

Accessibility

https://s.aolcdn.com/hss/storage/midas/bb6756ad9c524c0816e3ff74c4cddd42/203251771/braille-display-u-

michigan.jpg

http://evstudio.com/wp-content/uploads/2010/04/ADA-turning-500x326.png

Project Delivery

https://s-media-cache-ak0.pinimg.com/originals/3b/

06/72/3b06727081f439d551ae769fb5b598a0.jpg

Version Control

http://thedreamwithinpictures.com/wp-content/uploads/2015/07/ac4f6__psdrevisioning.jpg

Designing Architecture Like We Design Software

Potential applications

WebGL – Web Graphics Library 

WebVR– Web Virtual Reality

Virtual Reality

Amit Nambiar MSCD '16

Virtual Reality

George Wang MSCD '17

Augmented Reality

SketchUp + Hololens

THREE.js

Unity

D3.js

Highcharts

Taxi Visualization

PlayCanvas

Modelo

Flux

Onshape

Rehan Butt

This concludes The American Institute of Architects Continuing Education Systems Course

hello@dzgn.io

top related