평소 나는 프로젝트의 경험이 부족하다고 느꼈고, 프로젝트 경험을 쌓아야겠다는 생각으로 졸업요건에 없는 종합 프로젝트1 수강 신청하게 되었다...😊

(기업과 함께 산학협력프로젝트를 진행하면 많이 배울 수 있고, 팀원을 직접 모으지 않고 낯선 사람들과 협업할 수 있다는점이 개인적으로 수업에 매력을 느낌)

팀을 구성한 후, 8개의 기업 목록중 팀회의를 통해 1,2,3지망을 선정해서 제출했다. 팀원들은 모두 웹&앱 개발에 관심있는 상태였고, 미텔슈탄트는 우리가 선정한 1지망 기업이었다.

회사소개

협력기업 : 미텔슈탄트
주제 : 플레이스타트업 웹&앱 개발 프로젝트
플레이스타트업은 모바일 앱과 블록을 이용하는 창업 교육 게임이다. 앱을 이용해 기업을 설립하고 블록 부품 구매와 블록 생산 그리고 생산이 완료된 블록을 판매하여 기업을 운영하면서 창업을 체험할 수 있는 어플이다.

추진배경

플레이스타트업을 활용한 교육 프로그램이 보다 활발하게 진행되기 바라고 이를 위해 관리자 프로그램 안정화 작업과 내부 기업 유형 변경 등을 진행하면서 앱의 문제와 기능을 추가 개선하는 것을 목표로 두고있다.

회의내용

기업 매칭이 끝나고 회사 측 멘토님과 대표님과 첫 회의를 했다. 대표님께서 회사 측에서 프로젝트 제안한 그대로 구현하는 것도 좋지만, 저희가 직접 앱을 사용하면서 문제점을 찾고 개선하는 것이 어떻겠냐는 제안을 하셨다. 그리고 프론트 담당 인원은 초중고 대상으로 강의 하는 강사님들이 UX적으로 불편한 부분이 많다고 피드백을 받아서, 이번 기회에 같이 개선했으면 좋겠다고 하셨다.

프론트엔드 개발자에게 UX?

그래서 나는 본격적으로 코딩하기전에 UI/UX 공부를 먼저 하려한다. 보통 회사에 디자이너 포지션이 있어서 개발자의 영역은 아니라고 생각하는 경우가 많다. 하지만 나는 프론트엔드 개발자는 시각적인 부분을 구현하는 역할이며, 디자이너와 협업을 하는 경우가 많기 때문에 ux에 대해 어느정도의 지식은 갖춰야 한다고 생각했다.

결국 웹, 앱을 사용하는 사람은 사용자이고, 사용자 사용성의 퀄리티를 올리기 위해 사용자를 이해해야한다.

이번 페이지는 인프런 강의와 아티클을 읽고 좋은 내용은 정리할 계획이다

UX 강의

급격한 기술의 발전으로 사람들은 새로운 기술에 대한 거부감, 학습과 적응에 충분한 시간이 필요하다. 따라서 기술과 사람간의 간극이 발생 => UX의 역할

UX 디자인 : 사용자(User)가 경험(EXperience)하는 총체적인 과정에서 쉽게 이해할 수 있는 맥락(Context)을 만드는 일.

UX 디자이너의 몫 : 사용자 중심이 되는 관점에서 매끄러운 경험을 고려해 더 빠르게 원하는 길로 이끄는 것.(UX의 개념은 추상적이고, 모호해서 한 마디로 표현하기 어려움.)

1. 사용자의 정확한 요구 사항을 만족시킬 것
2. 사용하게 되는 과정에 단순하게 즐거움이 있어 사람들이 가지고 싶고 사용하고 싶게 할 것.
3. 사용자가 직접 필요하다고 말하는 것 이상을 제공해야하며 이를 위해 여러 분야 서비스를 매끄럽게 통합할 것.

정리하자면 좋은 UX를 만들기 위해서는 사용자 만족, 단순함, 우아함이 필요하다.

UI : 사용자가 시스템을 입력하면 출력 장치를 통한 정보 제공이 이뤄지는 디자인.

UI의 8가지 원칙

1. 시각/기능적 일관성 유지
   ex)색상, 레이아웃, 대소문자, 글꼴

2. 보편적인 사용성 추구

3. 유용한 피드백을 제공
   ex)색상, 아이콘, 경고 메세지를 토한 즉각적인 피드백

4. 종료 상황을 알리는 대화 상자를 설계

5. 오류를 처리할 수 있는 간단한 방법을 제공
   ex) 선택 불가능한 날짜 회색으로 표시

6. 처리한 동작을 쉽게 되돌릴 수 있어야 함
   ex) 뒤돌아가기 기능

7. 수정, 변경, 설정 배치 => 사용자 니즈 충족

8. 7숫자 이론

7가지 인터렉션 법칙

1. 사용자가 익숙한 순서대로 정렬만되어 있으면 선택할 정보가 너무 많아도 결정하는데 시간이 오래 걸리지 않는다. (스크롤과 페이징 제외)

2. 버튼끼리 가까워야 가벼운 인터렉션이 일어난다.

3. 마법의 숫자 7

4. 애초에 실수를 하지않도록 제한
   ex) 대문자 사용 불가 문구 사용

5. 동작 후 알려주는 피드백
   ex) 비밀번호 잘못 누르면 전체 창이 흔들림, 아래로 스크롤하면 새로고침 상태

6. 이미지, 직접적인 단어를 사용해서 제품 보는 것만으로 어떻게 사용하는지 본능적인 직관으로 알게 하기.

UX Writing 3가지 원칙

1. 사용자 중심으로 문장 설계
   ex) 실패, 인증 -> 로그인 에러, 로그인

2. 사람들은 F자 형태로 화면을 읽는다
   ex) 중복되지않고 간결한 텍스트를 통해 빠른 행동 유도

3. 다음 단계 안내 (예외 케이스)

UI/UX 공부법?

공부법은 딱히 없는것 같다. 최대한 사용자 입장에서 많이 생각하고, 유명한 웹사이트 or 앱을 많이 사용해보는 방법이 가장 좋은 방법이 아닌가 생각한다.