UXUI 인턴

[유데미x스나이퍼팩토리] UI/UX 인턴형 프로그램 4기 과정 2일차 – UXUI의 이해

vpdcong 2024. 6. 25. 18:03

 

 

 

오늘은 루씨의 UXUI 디자인 채널을 운영하는 박수진 강사님의 강의가 있었다. 오늘 오전에는 UXUI 정의 및 이해에 관련한 강의가 주를 이루었다.

 

 


 

 

디자인이란?

1990년대 이전 - 미적인 또는 조형 형태를 만드는 일

1990년대 - 비즈니스 또는 서비스에 맞게 설계 및 구현

2000년대 이전 - 제품 또는 서비스 이용시 경험을 변화시키는 작업

 

 

현재의 디자인이란?

그리는 행위가 아닌 '문제를 정의하고 해결하는 일'

 

 

디자이너의 역할

가치있는 문제를 발견하고 정의하고 해결해 나가는 일

 

 

 

 

UX

사용자 관점에서 좋은 경험을 제시하는 절차

UI

서비스가 구체적으로 보여지는 형태와 정보의 배치 및 구성

  • 두가지가 잘 어우러져야 좋은 서비스가 만들어진다. 두 가지의 비중이 더 커지지 않고 적절한 밸런스를 유지하는 것이 중요한 것 같다.

 

 

 

 

UXUI 디자인

  • 비주얼 디자인(GUI) - 표면층에 시각형태, 색채, 표현방법 등 시각적 경험
  • 사용자 인터페이스(UI) - 내용을 구성하고 배치 표현
  • 인터랙션 디자인(IXD) - 사용자의 행동을 유도하고 실행, 피드백 제공 등 동적 경험
  • 정보구조 및 흐름(IA, User Flow)
  • 서비스(Content, Function)
  • 전략 및 콘셉(Concept)

 

사용자 경험은 사용자가 기업, 서비스, 제품과 상호작용하면서 얻는 모든 측면의 경험을 의미한다.
- 도널스 노먼

 

 

 

 

UX

User Experience

- 제품/서비스 이용 과정과 그 결과가 얼마나 가치있고 만족스러운가?

- 기능이 좋고 디자인까지 좋면 좋은 사용자 경험을 제공할까?

- 디자이너는 사용자가 어떤 생각을 하는지, 어떻게 행동하는지, 어떤 감정을 느끼는지 알아야 한다.

  • 인지 - 동기, 목표, 고민, 갈등, 회상, 판단 
  • 행동 - 유입, 탐색, 비교, 선택, 인증, 활동, 보류, 공유, 저장
  • 감정 - 좋아요, 싫어요, 선호도, 믿음, 관심, 불안, 우려, 반발

- 사용자의 니즈를 알아낼 것

 

 

UX 사용자 경험 단계

Easy

사용자 경험 단계 중에서 기본 단계인 사용자에게 쉽고, 편하고, 구매를 간편하게 하는 단계

 

Pleasure

사용자 경험 단계 중에서 두번째 단계인 사용자에게 유쾌하고, 상쾌한 경험을 주는 단계

 

Fun

사용자 경험 단계 중에서 세번째로 높은 단계인 사용자에게 즐겁고 재미있는 경험을 주는 단계

 

Joy

사용자 경험 단계 중에서 가장 높은 단계인 사용자의 습관을 바꿀 수 있는 서비스의 최종목표

ex) 에어팟, 인스타그램, 유튜브

 

 

 

UX 관점에서 바라보기

  • 카카오톡 선물하기 - Human value를 녹여내야 서비스가 성공한다.
  • 네이버 스마트스토어 - 쇼핑몰의 패러다임을 바꾼 예시, 차세대 비즈니스 모델을 예측해서 잘 만들어진 케이스

 

Golden circle

  • Why - 서비스를 왜 만들었을까? 존재이유 또는 신념
  • How - 목적을 실현하기 위한 행동(Why를 달성하기 위한 방법)
  • What - 결과물(How를 실현하기 위한 구체적인 기능 또는 기술)

 

 

 

 

 

UI

User Interface

사람과 사물 또는 시스템, 기계, 컴퓨터 프로그램 등 사이에서 의사소통 할 수 있또록 일시적 또는 여우적인 접근을 목적으로 만들어진 물리적, 가상적 매개체

  • UI 디자인은 화면 내 정보를 구성하고 배치하며, 기능의 형태를 디자인하는 영역이다.
  • 사용자들에게 정보를 강조, 대비, 균형, 요약을 정해서 시각적 계층 구조로 자연스럽게 이용하도록 한다.

 

Usability

사용성이란 어떤 도구나 인간이 만든 물건, 서비스를 어떤 특정 목적을 달성하기 위해 사용할 때 어느 정도 사용하기 쉬운가 평가를 위한 방법

 

User Centered Design

사람, 비즈니스, 기술을 결합해서 사용자 중심의 디자인을 통해 사용자의 니즈를 충족하고 비즈니스가 성장하도록 하는 것

 

 

 

Process

Waterfall

  • 1970년대부터 사용한 방법론
  • 폭포수와 같이 기획 > 디자인 > 개발 등 프로세스가 순차적으로 진행됨
  • 단계별로 팀으로 인식하고 다음 단계로 넘어가려면 최종 승인 과정을 거쳐야함
  • 시간이 많이 걸리고 유연한 대처 어려움

 

Agile

  • 2001년부터 시작한 프로세스
  • 큰 프로젝트를 잘게 쪼개어 진행
  • 클라이언트의 요구에 유연한 대처가 가능
  • 개발과 디자인이 긴밀한 커뮤니케이션으로 프로젝트를 빠르게 진행
  • 계속되는 수정으로 업무 강도가 클 수 있으며 최종 파일 정리가 꼭 필요

 

 

 

 

UXUI 핵심 개념

해상도k

스크린의 선명도

이미지의 최소 단위인 픽셀(Pixel)이 모여 이미지의 해상도를 결정함

 

Pixel

디스플레이에서 가장 기본이 되는 단위

디바이스에 픽셀이 모여 해상도가 됨

픽셀이 많을 수록 선명하고 깨끗하게 보임

 

Resolution

PPI : 1인치 안에 들어가는 픽셀의 수

DPI : 1인치 안에 들어가는 점의 수

 

브라우저

HTML 문서와 그림, 멀티미디어 파일 등 월드 와이드 웹을 기반으로 한 인터넷의 컨텐츠를 검색 및 열람하기 위한 응용 프로그램의 총칭

ex) 사파리, 크롬, 엣지, 웨일, 파이어폭스, 오페라 등

 

색상 모드

  • RGB - 가산혼합으로 빛을 섞을 수록 밝아지고 흰색이 된다. 홈페이지, 앱 디자인 등 모니터로 보는 디자인을 한다
  • CMYK - 인쇄디자인은 모두 CMYK로 한다. 감산혼합으로 물감을 섞을수록 탁하고 어두워진다 

 

와이어프레임

앱과 웹사이트의 구조와 기능을 파악할 수 있는 설계 도면

앱과 웹의 구조와 용도를 파악하는 것이 와이어프레임의 목표

 

프로토타입

디자인이 완성된 이후 개발 전에 실제와 비슷하게 테스트하는 것

 

 

 

 

 

UXUI 핵심 개념

업무범위

  • 서비스 기획자
  • 디자이너
  • 개발자
  • 웹디자이너 - 웹사이트, 제품 페이지, 온라인 배너, 이벤트 페이지
  • UI 디자이너 - 기획 참여, UI 개선, 구축 및 리뉴얼, 디자인 시스템 설계
  • UX 디자이너 - 리서치, 시나리오 설계, 사용성 분석 및 개선, 디자인 시스템 설계

*프리랜서로서 일을 할때 디자인시스템을 요구를 하면 추가 비용을 반드시 받아야 한다.

 

 

인하우스 vs 에이전시

인하우스

  • 자사 웹사이트 또는 앱 디자인
  • 자사 서비스, 브랜드를 운영하는 디자이너
  • 서비스 개발부터 운영까지 모두 담당하여 UX 설계와 개선에 더 집중함
  • 데이터 수집 및 데이터 기반 서비스 개선
  • 일정과 업무량을 내부에서 조절 가능해서 워라벨 가능
  • 연봉은 회사의 성장에 따라 좌우됨
  • 디자인 이외의 업무도 해야할 수 있다
  • 디자인보다 서비스 전반적인 매출이 더 중요

 

에이전시

  • 기업 웹사이트를 대행하는 업무
  • 의뢰한 회사의 웹사이트, 쇼핑몰을 제작
  • 클라이언트의 요구사항대로 프로젝트가 진행됨
  • 업무강도가 상황에 따라 다르다
  • 다양한 프로젝트 경험 가능
  • 디자인에 집중해서 디자인 퀄리티가 빠르게 성장한다
  • 연봉이 정체되기 쉽다
  • 하나의 서비스를 운영하지 않고 제작 후 바로 끝나기 때문에 다양한 경험을 할 수 없다
  • 야근, 주말, 명절 등 워라벨이 힘들다

 

스타트업(소규모)

  • 기획팀, 디자인팀, 개발팀이 구분이나 역할을 명확하게 구분X
  • 디자인과 코딩을 같이 하는 조직도 있어 코드 구현이 가능한 디자이너, 다양한 능력과 툴 사용 능력 갖춘 디자이너 선호
  • 제안서 작성부터 기획, 디자인까지 전체 프로세스를 경험해 볼 수 있다
  • 능력있는 선임자가 없다면 배울 수 있는 환경이 아니다
  • 스스로 배우고 실력을 향상 시켜야한다
  • 잘못하면 프로젝트가 완전 망할 수 있다

 

중소기업

  • 기획팀, 디자인팀, 개발팀 구분
  • 프로세스와 팀문화가 발달되어있어 주니어 디자이너는 다른 팀과 협력할 일이 별로 없다
  • 프로세스를 중시하는 문화가 지배적이어서 일정 조율을 최우선으로 한다
  • 보통 선임자가 있어서 어깨 넘어로 디자인을 배울 수 있다
  • 업무 분담이 세밀하고 조직적으로 체계적이다
  • 잡다한 일을 하지않아 업무 효율이 최상이다
  • 다른 팀과 소통이 거의 없어 커뮤니케이션 능력이 떨어진다
  • 다양한 경험을 할 수 없고 디자인만 해서 프로세스를 잘 모른다

 

프리랜서 디자이너

  • 자유롭게 업무 시간과 스케줄을 조절할 수 있다
  • 코딩이 가능하다면 수익을 많이 낼 수 있다
  • 제안서 작성, 클라이언트와 미팅, 업무 조율, 계약서 작성, 디자인, 퍼플리셔와 소통 등 모든 일을 혼자 해야한다
  • 계약을 위해 처음에는 고생한다
  • 다른 팀원과 같이 성장할 수 없다
  • 정기적으로 월급을 받을 수 없으니 금전적인 압박이 올 수도 있다
  • 클라이언트의 요구를 다 들어야하니 감정적으로 힘들다 주니어 디자이너라면 경험이 부족해 힘들 수 있다

 

 

 


 

 

 

이후에 오후수업은 피그마 실습을 공부하는 시간을 가졌다.

 

 

내가 만든 허접한 아이콘... ㅋㅋㅋ

이후에도 자신이 사용하고 있는 어플리케이션 속 아이콘을 따라 만들어보는 실습을 가져보았다.

 

 

 


 

 

이후에는 팀별로 개선하고자 하는 어플리케이션을 선정하는 시간을 가졌다. 이번에 정한 것들은 앞으로 3주간 진행할 팀 프로젝트가 되겠다.

 

 

온라인에서 화면이 송출이 되지 않는 경우가 발생하기도 했고 채팅창을 바로 확인할 수 있는 상황이 아니셨던건지 채팅으로 말씀드려도 바로바로 고쳐지지 않았던게 너무 아쉬웠다...  그리고 마지막에 개선하고자 하는 어플리케이션 주제를 선정할 때에도 질문사항이 생겨 강사님을 불러보아도  바로오지 않으셔따...😂  온라인 좀 신경 써주세요 ㅠㅠㅠ

 

 

 

——————————————————————————

본 후기는 유데미 x 스나이퍼팩토리 UI/UX 인턴형 프로그램 4기 과정(B-log) 리뷰로 작성 되었습니다.