11주차 과제 발표

10주차 피드백 + 보충 사항

  • 튜토리얼 화면 구축
  • UI 디자인 수정 + 스케치로 옮기기
  • 사용성테스트 바탕 수정사항들 고치기
  • 주식 탭 태스크플로우 재정비

1. 튜토리얼 텍스트 짜기

리원 수인 아현

<퀴즈>

퀴즈는 주식과 관련한 정보를 찾아보고 배울 수 있는 탭이에요! 매일 제공되는 새로운 뉴스 소식과 주식에 대한 퀴즈에 참여해보세요.

뉴스레터를 통해 이번주 이슈가 되었던 소식들에 대해 알아볼 수 있어요. 아래 항목들을 클릭하여 시작하세요!

<주식화면>

전망분석페이지에서는 종목에 대한 투자 매력도와 전체 주식에 대한 순위를 나타내 줍니다! 이 항목들은 시스템에 따라 평가 되는데요~

차트 점수에서는 세 가지의 차트 분석법으로 점수를 나타내줘요!

일목균형표: 주가의 움직임을 5가지의 선으로 표현하여 주가를 예측하는 방법 (>더보기)

이동평균선: 주가가 올라가고 내려가는 것의 평균을 맞춰서 표현한 선()을 분석하는 방법 (>더보기)

거래량분석: 종목이 거래되는 양을 분석하는 방법 (>더보기)

수급 점수는 외국인과 기관이 전일에 얼마나 들어오고 나갔는지를 나타내주는 지표에요!

차트페이지에서는 일, , , 10, 60분 단위로 주식의 등락을 확인할 수 있습니다.

(> 초보자를 위한 차트 공부법 탐색하기)

<그룹>

여기는 함께하는 마라톤 맵이에요. 우리 그룹이 어디까지 왔는지 알 수 있어요!(목표 부분 강조)

!—여기는 미션부분 정해지면 더 자세히 작성해둘게요—!(미션부분 강조)

우리 그룹엔 어떤 개미들이 있는지 살펴볼까요?(프로필 클릭)

우리그룹 다른개미들이 작성한 러닝다이어리나, 글들을 확인할 수 있어요.(프로필 안의 글들 강조)

(뒤로가기 강조)

우리그룹 개미들이 잘하고 있는지 볼까요?(그룹보드 버튼 강조)

<그룹보드>

개미들이 목표에 달성하면, 축하할 수 있는 글이 쓰여요!(축하부분 강조)

개미들끼리 서로 물어보고, 응원을 건낼 수 있어요!(커뮤니티 강조)

매주 개미들이 달성하는 미션도 그룹끼리 공유할 수 있어요!(미션수행부분 강조)

(필터강조)자신이 원하는 글만 볼 수 있어요!

(주식단어장 강조)주식을 공부하면서 모르는 단어를 저장해두고, 공부할 수 있어요!

<성향테스트 개인 목표>

(차근 차근 목표 정하기)주런주런은 직접 설정한 목표를 향해 달려가는 주식 어플리케이션이에요!

먼저 목표를 설정해볼까요?

주식을 통해 수익을 내고 싶은 만큼 목표를 설정해보세요.

<홈 화면>

(알림 )알림을 확인해보세요!

(검색 )찾고 싶은 주식을 검색해볼 수 있어요!

(하단 바 순서대로)메뉴, 찜한 주식, , 마이 페이지, 그룹 화면

(자산 관리)나의 자산 현황을 숨기고 싶다면 시크릿 탭을 이용해보세요!

(어제와 오늘은?)어제에 비해 내가 산 주식이 얼만큼 오르고 내렸는지 확인할 수 있어요.

(마라톤 맵)그룹의 목표 달성 현황을 홈에서 간편하게 확인할 수 있어요.

(추천종목)다른 사람들이 많이 관심을 가지고 있는 추천 종목이에요.

<러닝 다이어리>

이건 하루 동안의 매매일지를 쓸 수 있는 러닝 다이어리예요.

매수/매도한 기록은 자동으로 등록이 되며, 직접 일지를 쓴 종목은 로고와 등락이 등록 되어 캘린더에서 바로 확인할 수 있어요!

작성을 눌러 한 번 써볼까요?

그룹화면, 주식화면, 성향테스트, 러닝다이어리, 홈화면 등 사용자가 사용하면서 이해하기 조금 어려운 메타포가 들어간 부분들에 튜토리얼을 초회한정으로 보여주기로 하였고, 그에 따라 주식 초보자를 위한 앱인 만큼 친근하고 알기 쉬운 말투로 설명한다. 

2. 컬러 선정 & UI 레퍼런스 선정

* 컬러 선정

레퍼런스 본문 : https://docs.google.com/document/d/1QwTCmrMalvZQBlXED7dHJ0C6Q6blxm3C_xYyfTkDAl8/edit?usp=sharing

메인 컬러: #4D73F5
서브 컬러: #07038C
포인트 컬러: FFE600

* UI 레퍼런스 선정

UI : 3D 그래픽과 플랫한 컬러가 잘 어울리고 라운딩이 잘보이는 UI

 

3. 주식 태스크 플로우 재정비

수정전 페이지

* 수정 전 문제점

하단 탭 (검색) – 검색기능 으로 들어가게 되는 것이 불필요하다. 매수와 매도할 수 있는 창이 없다. 관심종목을 홈에서만 들어가는 것이 불필요하다. 보유 주식을 한눈에 확인할 수 있는 창이 필요하다.

* 주식 탭 브레인 스토밍

기존 주식앱 레퍼런스들

리원

<매수>
주식 페이지(전체뉴스/현재가/팔자/사자)-사자-현금/신용-주문 가능 조회(내 돈으로 몇주까지 살 수 있는지 나타내주는 거)-지정가/시장가/기타주문-지정가 설정(-/+)-수량입력(-/+)/초기화 버튼-사자 버튼-주문이 전송되었습니다

<매도>
주식 페이지(전체뉴스/현재가/팔자/사자)-팔자-현금/신용/대출상환-주문 가능 조회/보유잔고-지정가/시장가/기타주문-지정가 설정(-/+)-수량입력(-/+)/초기화 버튼-팔자 버튼-주문이 전송되었습니다

<정정/취소>
원주문-주문내역조회-가격 설정(-/+)-지정가/시장가/기타주문-수량입력(-/+)/미체결 전량 입력/초기화 버튼-취소 주문하기/정정 주문하기

<체결>
일반/예약-(일반) 체결/미체결-종목명, 매매구분, 주문 수량, 미체결수량, 채결 수량, 주문 단가, 체결 단가, 주문 유형, 주문 번호, 원주문, 주문시각
일반/예약-(예약) 전체/처리/미처리-날짜 선택-종목명, 매매구분, 주문 수량, 미체결수량, 채결 수량, 주문 단가, 체결 단가, 주문 유형, 주문 번호, 원주문, 주문시각

 

수인

<하단 주식탭>

– 관심종목
관심종목으로 추가해놓은 주식의 리스트가 뜸. (캔들이나 라인의 간단한 지표, 종목 이름, 등락률(대비), 현재가 나타내고 정렬을 따로 탭으로 빼둬서 표시

– 보유종목
정렬 따로 탭으로 빼둬서 표시 

  • 최근조회 (관심종목이랑 같음)
  • 체결 (or) 주문내역
  • 국내/해외 스위치버튼은 그닥 필요없을것같고.. 차라리 드로우 방식이 나을것같음..

<종목 탭>
주식탭에서 종목 누르면 보통 투자앱이랑 비슷하게 반정도로 창뜨는데 이름,시가,고가,저가 같은 정보는 표시하되 우리 만들어놨던 차트,위험도 알려주는 페이지로 “자세히보기”같은 버튼 있었으면. 
즐겨찾기 버튼은 종목이름 왼쪽에 있고, 뉴스랑 차트 보는게 따로따로 있기보다 우리 주식사는 페이지 축소형으로 반나눠서 아래에 통째로 정렬하고 스위치가능한 방식으로 구성

  • 현재가/ 사기/ 팔기

<사고팔기 탭>

  • (매수,매도) 거래량, 시가, 등락률 보이는 그런건 위에 크게 하구 상한가 하한가..표시는 최대한 길게 표시하는게 좋을듯 세개중엔 한투가 제일 쉽게 표시되는것 같음
  • 정정은 상한가 하한가 시가 부분이 더잘보이면 어떨까요? 위에는 자기 주문내역을 가시적으로 표시하기
  • 체결목록은 스텝스꺼가 좋은거같음 !! 장바구니나 주문내역처럼 사용자에게 더 익숙한 인터페이스였으면. (블록방식)

 

아현

<매수>
전망분석, 차트 이용 – 거래호가 탭 – 원하는 가격 클릭 – 매수 클릭 – 계좌 비밀번호 입력 (계좌 연결을 미리 해뒀다는 가정 하에 : 계좌 연결 창 따로 필요) – 수량과 가격 입력 – 매수 주문 확인창 – 매수 주문 – 완료

<매도>
마찬가지로 거래호가 탭 – 원하는 가격 클릭 – 매도 클릭 – 계좌 비밀번호 입력 – 수량과 가격 입력 – 매도 주문 확인창 – 매도 주문 – 완료

<정정/취소>

(동일함) 거래호가 탭 – 원하는 가격 클릭 – 정정/취소 클릭 – 계좌 비밀번호 입력 – 수량과 가격 입력 – 정정/취소 확인창 – 정정/취소 – 완료 or 미체결 탭을 새로 만들어서 거기에서 바로 똑같은 과정을 반복하여 할 수 있도록 함.
=> 체결 탭 연결 후 옆에 거래호가 탭의 미니미 버전같은 거 두기

 

* 주식 탭 태스크 플로우

하단 탭 주식탭을 통해 관심 종목, 보유 종목, 최근 본 종목들을 확인 할 수 있으며
종목 리스트를 통해 매도.매수.정정 취소가 가능하게 한다.

종목을 눌렀을 때 다른 주식앱과 달리 기존 주식탭에서 볼 수 있는 전망분석 / 차트 / 거래호가가 더 간략화 되어서 보여지게 하고, 매도와 매수는 기존 앱 중 한국투자증권에 나온 상한가/하한가와 거래표시 가 양쪽 사이드로 보여지게 하며, 체결 탭은 초보자가 이해하기 쉽도록 온라인 쇼핑몰의 주문내역처럼 표시한다.

 

4. xd 수정

* 시작페이지

  • 안드로이드 해상도로 수정(공통)
  • 상단바 적용 (공통)
  • 가이드라인 base line 적용 (공통)
  • 텍스트스타일, 구성요소 통일 (공통)

* 성향테스트 페이지

  • 개미 캐릭터 설명 추가
  • 개인 목표 설명 버튼 추가
  • 매칭 시스템 구체화 – 그룹 만드는 과정 자세하게 추가
  • 성향테스트 마지막 화면 추가

* 홈 화면 페이지



  • 홈화면 튜토리얼 추가
  • 추천종목 설명 버튼 추가
  • 그룹 알림 / 개인 알림 통합

* 자산관리 페이지

  • UI 수정 (파랑색)

* 주식구매 페이지

  • 주식페이지 개미 캐릭터 튜토리얼 추가
  • UI 수정 (파랑색)
  • 종목분석 데이터 표현방식 수정, 설명 추가
  • 주식호가 표현방식 / 매수매도 방법 수정

* 그룹 페이지

  • 그룹 페이지 개미 캐릭터 튜토리얼 추가
  • UI 수정 (파랑색)
  • 퀴즈 -> 미션으로 수정
  • 미션 아이콘 수정
  • 주식 단어장 설명 수정 

5. 3차 사용성 테스트

공통점(장점)

– 성향테스트 끝나고 나오는 문구가 좋았다. 동기부여가 된다.
– 아이콘 이해가 잘됐음. 하단바 개인 – 그룹은 한번 더 언급함. 

 

공통점(단점)

– 튜토리얼 할 때 다시 보지않기가 필요하다. 
– 주식단어장이 그룹에 있는게 싫다. 자신의 모름을 드러내는 게 싫다. 

 

보완할 점

– 그룹 화면 처음에 프로필갯수를 보고 우리 그룹이 5명인줄 알았다.
– 튜토리얼 시작 전에 사용자에게 선택의 여지를 주거나 지금부터 튜토리얼을 시작한다는 메세지가 있어야 할것 같다.
– 홈에 주식관련 뉴스나 주식 트렌드를 볼 수 있는게 있었음 좋겠다.
– 개인페이지 성향분석 동그라미보단 파이같이 나눈게 좋다. (표가 아니라 로고로 인식함)
– 튜토리얼에도 업적달성이 있었으면 좋겠다. (앱내 기능들을 확실히 이해하기 위해)
– 그룹화면 맵에 2.3.4 가 남은 퍼센트로 적어줬음 좋겠다. 지금은 과제가 3개 남은 느낌. 길 표시는 귀엽다. 
– 성향테스트 : 랜덤 매칭할 때 필터링을 설정해서 어느 정도 사람의 성향을 선택할 수 있었으면 좋겠다.
– 계좌 개설 절차가 생략되어 있긴 한데 그게 가장 장벽이었어서 계좌 개설 절차가 한페이지로 나와있었음 좋겠다. 
– 그룹보드의 명칭 개선이 필요하다.
– 미션 수행 시 동기부여가 필요함. 뭔가 보상이 있었으면 좋겠다고 함. (페널티는 제외)
– 목표설정 : 직관적인 이미지가 좋다. (+ 다만, 영화 표시는 팝콘보다는 예쁜 티켓이 있었으면 좋겠다.)
– 성향테스트 : 설문 화면이 투박하므로 카카오뱅크처럼 친근함이 있었으면 좋겠다.
– 성향테스트 : 디자인적으로 예쁘지 않은데(딱딱하다는 뜻) 설명만 써져 있는 느낌, 친근감 없다. 진입 장벽 느껴짐. 말이 너무 간단하고 딱딱해서 어렵다.
– 주식구매 : 주식 사는 구매 버튼을 찾기 어려움 – 왜 전망분석에서만 있는지 모르겠다.
– 그룹 보드 : 주식 단어장 아이콘이 이해가 안된다. 갑자기 나오는 느낌.
– 그룹 홈 : 튜토리얼을 안 읽고 넘겨서 그런지 설명이 부족하다고 느꼈다. 
– 팀 구성페이지 : 팀 화면 시작하는 게 이해가 안된다. 설명이 필요함. (‘무엇을’이 없다.) (별안간 시작해볼까요? 해서 이해가 안됨)
– 튜토리얼을 그냥 건너뛰는 경향이 있다. ‘아무 부분이나 클릭 시 이동’이 아니라, X버튼 클릭시 이동으로 만들어서 제한을 줘야한다. (처음에 튜토리얼 어떻게 끄는지 물어봄)
– 주식구매 : 탭마다 구매 버튼이 있었으면 좋겠음
– 파란색 글씨에 밑줄이 있으니 하이퍼링크가 연결된 줄 알았다. (클릭이 헷갈림)

 

(언급된 것은 아니지만) 이외에 해야 할 것

– 주식 거래 화면 옆에 호가창이 작게 뜨게 하기
– 매도, 정정/취소 화면도 만들기
– 계좌 연결 화면 만들기
– 러닝 다이어리(달력 일자 위치 수정), 메뉴, 검색 등 추가할 부분 추가하기
– 단어장 나만 보기 기능 추가
– 전체 커뮤니티 창 필요
– 앱 로고 만들기
– 전체적인 디자인 보완
– 그룹 보드 내 검색기능

 

댓글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다