전문 UI 디자이너로서 UI 인터페이스 설계, 대화형 설계 작업 흐름, 요구 사항부터 제품 온라인까지 전체 제품의 전체 작업 흐름을 이해해야 합니다.
다음은 인터넷 제품 각 부서의 업무 할당 및 절차입니다.
그림에서 볼 수 있듯이, 인터넷 제품은 기획에서 최종 온라인 마케팅에 이르기까지 서로 다른 부서에서 책임을 분담해야 하며, 각 부서에서는 직무 구분에 따라 각 직종으로 세분화됩니다. 부서와 부서, 일자리와 일자리가 서로 협력해야 훌륭하고 효율적으로 프로젝트를 완성할 수 있다.
일반 인터넷 회사는
1, 제품 부서 (제품 관리자, 제품 전문가)
2, 디자인 부서 (GUI 디자이너,; 브랜드)
6, 운영 부서 (고객 서비스, 운영)
각 부서의 업무 책임은 다음과 같습니다.
제품 부서: 제품 조사 담당, 제품 프로그램 기획
설계 부서: 제품 시각 설계, 대화형 설계, 프런트엔드 레이아웃을 담당합니다. 프론트 엔드의 작업은 프로그램 개발과 마찬가지로 코드 코드이기 때문에 프런트 엔드를 개발 부서로 나누는 회사도 있습니다. 디자인 부서는 단순한 시각적 디자인 측면입니다. (데이비드 아셀, Northern Exposure (미국 TV 드라마), 예술명언) 하지만 이런 주장은 정확하지 않다. 프런트 엔드 코드 구현과 백그라운드 프로그램 개발, 모두 코드이지만 운용하는 기술은 다르다. 실현된 기능과 효과도 다르기 때문에 프런트 엔드 엔지니어가 디자인 부서로 나누는 것이 더 합리적이다.
R&D 부서: 제품 아키텍처 설계, 데이터베이스 설계, 전면 및 후면 코딩 설계, 사후 운영 및 유지 보수, 네트워크 보안
테스트 부서: 테스트 프로그램의 버그를 테스트하고 테스트 계획, 테스트 사례 및 테스트 보고서 등의 문서를 작성하여 프로세스를 최적화합니다.
마케팅 부서: 제품 기획 전략, 캠페인 기획 및 조직, 브랜드 기획 및 브랜드 이미지 구축, 마케팅 캠페인 및 홍보 활동.
운영 부서: SEO/SEM 최적화 프로모션, 플랫폼 이벤트 계획 (온라인 다운 링크), 광고 배치, 고객 관계 관리, 데이터 분석
디자인 부서의 직무 구분에는 일반적으로 UI 디자이너, 인터랙티브 디자이너, 프런트 엔드 엔지니어, 소규모 회사 직무 구분이 미비하며 상호 작용 디자이너의 업무 (상호 작용 프로세스, 상호 작용 와이어프레임, 상호 작용 효과) 를 제품 직원에게 맡기고 UI 디자이너의 참여와 완성이 필요한 프로세스를 정리합니다.
이 과정에서 정제된 실제 사용자 요구에 따라 제품 요구 사항을 결정하고, 제품 관리자는 의사 소통에 관련된 자료의 word, PPT, jpg 등을 논리 언어로 번역합니다. 가장 간단한 것은 제품 기능 뇌도나 기능 목록을 생산하는 것입니다.
제품 기능 뇌도:
제품 기능 목록:
사용자 경험 프로세스에 대해 논의하고 화이트보드 위에 프로세스 가장자리에 대략적인 UI 요소를 추가합니다. 이후 제품 매니저는 종이에 손으로 그린 버전의 와이어프레임을 만들 것이다.
이 단계에서 제품 관리자, UI 디자이너, 기술 엔지니어를 포함한 많은 논의가 이루어지며, 주로 프로세스와 주요 기능에 대해 논의하고 있으므로 이래라저래라 이래라 저래라 하는 스토리보드가 가장 빠르고 쉽게 수정할 수 있습니다. 이 섹션에서는 사용자 프로세스 및 주요 단계인 사용자 플로를 마무리해야 합니다. 각 단계는 주요 인터페이스입니다. 이후 제품 관리자는 종이판 저충실도 대화형 프로토타입 (전문 템플릿 및 도구 차용 가능)
2, 주요 인터페이스 와이어프레임 (상호 작용 기능 제외)
예비 제품 기능 요구 사항을 명확하게 정리한 후 제품 관리자가 계속 후속 조치를 취하고 의사 소통을 반복하며 확인 이 섹션에서는 주요 인터페이스의 UI 요소 및 레이아웃과 전역 레이아웃 조판 스타일을 결정해야 합니다.
3, 주요 인터페이스 비주얼 디자인
이 링크 UI 디자이너는 주요 인터페이스의 전반적인 비주얼 디자인을 만들어 다양한 스타일, 색상 조합, UI 요소 사용, 제품의 비주얼 디자인 스타일을 결정합니다.
4, 모든 인터페이스 와이어프레임 (대화형 기능 포함)
제품 관리자는 1: 1 상호 작용 및 프로세스가 있는 모든 인터페이스 와이어프레임 설계를 완료하고 확인합니다.
인터페이스 와이어프레임 (상호 작용 기능에 대한 해석과 설명을 추가합니다. )
와이어프레임 순서도
5, 모든 인터페이스 비주얼 디자인
UI 디자이너가 모든 인터페이스의 시각적 설계도를 출력하고 확인합니다.
6, 인터페이스 주석, 컷아웃
1, 모든 인터페이스 시각 원고를 확인한 후 먼저 각 인터페이스에 치수를 기입하고 그림을 프런트엔드 엔지니어에게 전달합니다.
콜아웃 (픽셀 셰프, 블루레이크 등 소프트웨어)
2, 인터페이스 컷아웃, 프런트엔드 엔지니어
컷아웃 폴더