iOS/Dreamin iOS Course

[앱기획] 프로토타이핑

HaningYa 2020. 8. 24. 20:15
728x90

프로토타이핑을 왜 해야할까

  • 아이디어로 바로 코딩하면 망한다.
  • 최소한 스케치 정도는 해야함
  • 없이 개발하다 보면 원래 목적과 다른 이상한 앱이 탄생함
  • 말로 하면 서로 다르게 이해할 수 있음
  • 그림을 통해 같은 생각을 공유해보자

Prototype is a living mockup

  • 디자이너나 기획자 만의 책임이 아니다.
  • 디자인은 어떻게 동작하느냐에 대한 문제이기 때문이다. 

목업 vs 프로토타입

목업: 실물모형

프로토타입: 시제품(실제로 동작하는 듯한)


목업 스케치 방법

  • 연필과 종이

이정도로 디테일 하게

  • 키노트 (애플 디자인 페이지에서 Keynote 용 에셋)
    (근데 처음에는 손으로 그리는게 좋다)
 

Apple Design Resources

Design apps quickly by using Sketch and Photoshop templates, plug-ins, and preconfigured UI elements.

developer.apple.com

  • 어도비 XD
 

Apple Design Resources

Design apps quickly by using Sketch and Photoshop templates, plug-ins, and preconfigured UI elements.

developer.apple.com

  • 오리가미 (Facebook)
 

Origami Studio — Origami Studio 3

With a new canvas interface, dynamic layout, Figma & Sketch support and a ton of peformance improvements and new patches.

origami.design


어도비 XD 사용해 보기

디바이스를 정해볼 수 있다.

 

몇가지 기능

  • 반복 그리드 (table view cell 반복)
  • 버튼 인터렉션 연결 가능 (앱 동작하는 것 처럼 가능)

키노트

  • 키노트에서 버튼 인터렉션 기능
    - 설정 ->문서설정 -> 프레젠테이션 유형 -> 하이퍼링크 전용 
    -> 해당 버튼에 링크 추가
  • 아이폰 화면처럼 하고싶은 경우
    - 키노트 문서를 아이폰 크기로 설정할 수 있음
728x90