< 페미위키:디자인
페미위키 사이트 개발 중 디자인 관련 내용을 정리한 문서입니다. 기술 관련 문서는 페미위키:기술을 참고하세요.
디자인팀 의사 결정 및 작업 방식
디자인팀의 작업은 디자인 기획 -> 작업 분배 -> 작업 의 순서로 진행됩니다. 각 단계는 모두가 동시에 진행이 완료될 때 까지 대기하는 것이 아닌, 각 큰 갈래의 업무마다 이루어질 예정입니다. 또한 큰 갈래 안에서도 다시 세부적으로 분배하는 것이 가능합니다. 예를 들어, 3분이 담당하기로 한 작업이 있다면, 기획->분배를 다시 거쳐 A님-1번 작업, B님-2번 작업, C님-3번 작업 등이 가능합니다.
디자인 작업의 우선순위는 페미위키:로드맵을 기반으로 합니다.
다음은 각 작업 단계에 대한 상세 설명입니다.
디자인 기획
- 큰 틀과 디자인의 방향성 등에 대하여 다같이 의견을 나누는 단계.
- 일시를 정해 함께 회의를 하거나, 기한을 정해두고 (카톡 혹은 위키를 통해) 의견을 나눕니다.
- 이 과정을 통해 작업의 순서와 분량을 파악합니다.
분배
- 디자인 기획을 통해 파악한 내용을 토대로 각자의 업무를 분담합니다.
- 작업 분배가 이루어지는 갈래/덩어리는 아직 상의가 필요합니다.
작업
- 각자에게 분배된 디자인 작업을 하는 단계입니다.
- 피드백이 필요하다고 생각이 되는 경우, 카톡 혹은 위키를 이용하여 의견을 나눕니다.
디자인 원칙
디자인 의사결정은 다음 원칙에 따릅니다.
- 독자 우선: 독자와 필자의 사용성이 상충할 경우 독자의 사용성을 우선 고려할 것
- 모바일 우선: 다양한 디바이스를 지원할 것. 특히 모바일 기기에서 원하는 문서를 쉽게 찾을 수 있고, 긴 글도 편하게 읽을 수 있을 것
- 컨텐츠 우선: 문서의 가독성이 가장 중요. 불필요한 꾸밈 요소나 잘 안쓰이는 요소 등을 최소화화여 필요 없이 주의를 분산시키지 않는다
작업 항목
아래 나열된 분류를 통해 작업 중인 항목을 표기합니다. 항목 뒷부분에 서명을 해주시기 바라며, 완료된 경우 항목 앞에 [완료]를 표기합니다.
기본 디자인 요소
기본적인 디자인 요소. 가장 우선적으로 전체적인 의견이 필요한 부분입니다.
- [완료] 로고
- 컬러
- 대표 컬러 - 연보라색
- ■302a45 - (@color4)
- ■4f4b93 - 체크박스 색 등으로 사용중
- ■5144a3 - (@color3)링크 글자 색 등으로 사용중
- ■746ccb - (@color2)
- ■aca8e0 - (#siteNotice border)
- ■aca7e2 - 버튼 배경색 등으로 사용중
- ■aca6e4 - (@color1)스킨 등에서 사용중
- ■c3bffd - 선택된 글자 배경 등에서 사용중
- 서브 컬러
- ■a5c831 - 바뀐글 등에서 사용중
- ■dae8b2 - 주시·주시 해제 알림창 배경색 등으로 사용중
- 구 토론 문서에서 쓰던 색들[1]
- ■afc8e7 ■fdba7d ■9ade8d ■fd9998 ■c5b1d4
- 대표 컬러 - 연보라색
- 스킨
- 컨셉 : 미니멀, 지적 섹시
- 사이트 레이아웃 그리드
- 대문
- [완료] 페미위키 인삿말
- [완료] 기여자 순위 (게임요소관련)
- 컨텐츠 바로가기
- [진행중] 도움말
공통
사용자 정보 영역
- 사용자
- 토론
- 알림
- 메시지
- 환경 설정
- 주시 문서 목록
- 기여
- 로그인/로그아웃
네비게이션 영역
도구 영역
- 여기를 가리키는 문서
- 가리키는 글의 바뀜
- 파일 올리기
- 특수 문서 목록
- 인쇄용 판
- 고유 링크
- 문서 정보
- (사용자 페이지인 경우) 사용자 기여
- (사용자 페이지인 경우) 기록 목록
- (사용자 페이지인 경우) 이메일 보내기
문서 도구
문서 탭
- 문서
- 제목
- 하위 페이지
- 분류
- “XXXX 문서에서 이동”
- 토론
- 최근 수정일
검색
저작권 및 각종 안내
- 저작권 안내
- 개인정보 정책
- 페미위키 소개
- 면책 조항
- 모바일 보기 / 데스크탑 보기
기타
- 각종 메시지 (저장되었습니다 등)
[완료] 문서 읽기 화면
최근 바뀜
문서 편집 화면
검색 결과 화면
기타
참고 자료
미디어위키 스킨 제작 매뉴얼
- Part 1: It explains what you need to consider when you’re designing the look and feel of your skin.
- Part 2: It explains how to get your skin to display content to the user.
- Part 3: It explains the different aspects you need to test and take into consideration when creating your skin.