1. 시스템 상태의 가시성(Visibility of system status) 2. 시스템과 현실 세계의 연결성(Match between system and the real world)
3. 사용자 통제와 자유(User control and freedom)
4. 일관성과 표준(Consistency and standards)
5. 오류방지(Error prevention)
6. 기억보다는 인지(Recognition rather than recall)
7. 사용의 유연성과 효율성(Flexibility and efficiency of use)
8. 심미적이고 최소화한 디자인(Aesthetic and minimalist design)
9. 사용자가 스스로 오류를 인식, 진단, 복구하도록 지원 (Help users recognize, diagnose, and recover from errors)
10. 도움과 문서화 (Help and documentation)
사용자 인터페이스(User Interface)를 위한 휴리스틱 평가
# 1. 시스템 상태의 가시성(Visibility of system status)
사용자가 지금 어느 시스템에 있고, 어디로 갈 수 있고, 어디를 지나왔는지 쉽게 이해시켜줄 필요가 있습니다가능한 빨리(이상적으로는 즉시) 사용자에게 피드백을 제공합니다. 사용자가 현재 상태를 알게 되면, 이전 상호 작용의 결과를 학습하고 다음 단계를 결정할 수 있습니다. 예측 가능한 상호 작용은 제품과 브랜드에 대한 신뢰를 만듭니다.
예시 : 당근 마켓 내가 판매하고 있는 상품의 [판매내역] "판매 중"인 상품, "거래 완료" 로 중고 상품의 현재 상황을 정리하여 보여준다
[시스템 상태의 가시성]을 잘 보여주는 당근마켓 사례
# 2. 시스템과 현실 세계의 연결성(Match between system and the real world)
: 디자인은 사용자의 언어로 말해야합니다. 타겟 고객이 실제 사용하는 언어, 개념 아이콘을 사용해서 사용자가 인터페이스 작동 방식을 더 쉽게 배우고 기억할 수 있습니다. 이는 직관적인 경험을 구축하는데 도움이 되기 때문입니다.
예시 : 슈퍼마켓의 물품 데이터 베이스 알파벳 순서로 물품 진열 VS 실 사용 카테고리별 상품 진열 어떤 마트를 가도, 알파벳 순서로 물품이 진열 된 곳을 찾기는 힘들 것입니다.
# 3. 사용자 통제와 자유(User control and freedom)
사용자가 실수를 할 때에도, 행위를 취소할 수 있는 방법과, 행위로 무슨 일이 일어날지 명확히 알 수 있는 정보를 제공해야 합니다. 사람들이 프로세스에서 뒤로 가거나 작업을 취소할 수 있어야 제품 사용의 자신감이 생겨납니다. 취소버튼과 같은 현재 상호 작용을 종료하는 명료한 방법을 알려줄 필요가 있습니다. 애플리케이션에서 출구가 명확하게 표시되고 발견 가능한지 확인하세요
예시 : 슬랙(slack) 이미 보낸 메시지를 편집, 삭제 할 수 있는 기능 사용자 통제와 자유 - slack
# 4. 일관성과 표준(Consistency and standards)
사용자는 우리 제품만 사용하지 않습니다. 대부분의 시간을 타사 제품을 이용합니다. 다른 제품에 대한 사용자의 경험은 자사 제품을 사용자에 대한 경험의 기대치를 설정합니다. 사용자가 어느 페이지를 보든지, 쉽게 이해할 수 있도록 기존의 유저 경험을 파악하고, 제품 안에서도 제목, 콘텐츠 영역은 일관적인 스타일을 유지하여 추가적인 학습이 없어도 경험을 원활히 진행할 수 있도록 사용자를 안내하세요.
예시 : 노션(notion) 일관적인 포맷으로 메모, 서류를 작성할 수 있도록 도와주는 노션 워드(word) 사용 경험이 있는 사용자라면 누구나 노션을 시작할 수 있을 정도로 직관적이고 심플하다 일관성과 표준 - 노션 화면
# 5. 오류방지(Error prevention)
사용자가 오류를 발생시키지 않도록 명확한 안내와 설명을 제공하고, 사용자에게 친숙한 방식으로 메시지를 작성할 필요가 있습니다. 예를 들어 [삭제], [저장]과 같은 버튼은 분리하여야 사용자가 어렵게 작성한 데이터가 손실되지 않습니다. 물론 실수를 저질렀다고 해도 시스템적으로 알려주는 것도 중요합니다.
예시 : Gmail 수신자를 깜빡하고 "보내기" 버튼만 눌렀을 때, 오류 메시지를 띄워 받는 사람을 지정하라고 안내해준다. 오류방지 - gmail
# 6. 기억보다는 인지(Recognition rather than recall)
시스템이 직관적일수록 연상을 통해 기억하기 쉽고, 학습 관련 비용이 절감됩니다. 예를 들어 “리스폰은 포르투갈의 수도입니까?”라는 질문과, “포르투갈의 수도는 무엇입니까?” 비교해보면 당연히 전자에 대답할 가능성이 더 큽니다. 원하는 것이 무엇인지 기억을 이끌어내게 하는 것보다는, 인지적인 노력을 줄여줄 선택지 옵션을 나열해주는 것이 사용자가 참여도가 높을 것입니다
예시 : 네이버 쇼핑 검색 시, 카테고리 노출 원하는 검색어를 입력하면 소비자가 원하는 스타일을 명확히 찾아갈 수 있도록, 카테고리/브랜드/컬러 등 다양한 선택지 옵션을 나열해 준다 기억보다는 인지 - 네이버 쇼핑 화면
# 7. 사용의 유연성과 효율성(Flexibility and efficiency of use)
초보자에서부터, 숙련자까지 모두에게 적합한 디자인을 제공하면 어떨까요? 새로운 사용자를 위해 설명이 충분하면서도 직관적인 인터페이스를 제공하면서, 사용자의 작업속도를 위한 단축키 또는 맞춤 설정 기능을 포함해 주면, 사용자들은 자신에게 적합한 방법을 선택할 수 있습니다.
예시 : photoshop 포토샵 첫 화면을 열면, 초보자를 위한 상세 가이드와 새로 도입된 신기능에 대해서 설명해 주며, 다양한 프리셋과 단축키를 제공한다. 사용의 유연성과 효율성 - 포토샵
# 8. 심미적이고 최소화한 디자인(Aesthetic and minimalist design)
예쁜 게 다입니다. 하지만 사용자 입장에서는 불필요한 디자인이 아닌, 가시성 높은 심플한 디자인이 가장 아름다운 디자인입니다. 사용자가 필요한 정보를 놓치게 만드는 인터페이스 요소를 찾아서 수정할 필요가 있습니다.
예시 : 카카오뱅크 기존 복잡해 보이는 은행 상품과 달리 기능을 한눈에 파악할 수 있는 이미지와 특징을 요약한 슬로건으로 금융 상품 이해를 돕는다 심미적이고 최소화한 디자인 - 카카오 뱅크
# 9. 사용자가 스스로 오류를 인식, 진단, 복구하도록 지원 (Help users recognize, diagnose, and recover from errors)
양식을 제출할 때 오류가 발생하면, 시스템은 어디에서 무엇이 잘못되었는지, 그 문제를 어떻게 해결하는지 알려 줘야 합니다. 물론 이때 나타나는 오류 메시지는 일반 언어(오류코드가 아닌)로 표현되어야 하며, 문제를 정확하게 표시하고 고쳐야 할 항목을 쉽게 연결해줘야 합니다.
예시 : 윈도우 문제 해결 관련된 문제들을 점검하고, 어떻게 해결해야하는지 도움을 제공하는 윈도우 문제 해결 솔루션을 클릭하면 현재 문제의 원인과 어떤 해결이 필요한지 알려준다. 사용자가 스스로 오류를 인식, 진단, 복구하도록 지원 - 윈도우
# 10. 도움과 문서화 (Help and documentation)
시스템에 추가 설명이 없으면 가장 좋겠지만, 사용자가 작업을 완료하는 방법을 이해시키게 하기 위한 문서를 제공해야 합니다. 도움말과 설명서는 검색하기 편리하고, 사용자의 작업 스텝에 발맞춰 보여줘야 합니다. 간결하게 수행해야 할 구체적인 단계를 나열하세요
예시 : 구글 고객 센터 자주 묻는 질문들을 카테고라이징 하고, 사용 흐름에 따른 상황별 해결책을 문서화로 정리하였다. 도움과 문서화 - 구글 고객 센터
import random
import numpy as np
# 이름을 랜덤으로 출력하는 함수
def get_name():
names = ["na1", "na2", "na3","na4", "na5", "na6", "na7", "na8", "na9", "na10"]
return random.choice(names)
# 나이를 20세에서 40세까지 랜덤하게 출력
def get_age(start=20, end=40):
return np.random.randint(start, end + 1)
# 나이와 데이터를 가지고, 데이터를 만들어주는 함수
def make_data(rows=10):
datas = []
for _ in range(rows):
data = {"Age": get_age(), "Name": get_name()}
datas.append(data)
return datas
모듈을 임포트 하여서 함수가 제대로 동작 되는지 확인하겠습니다.
from makedata import *
get_name()함수를 실행시킬때 마다 다른 이름이 나오는 것을 확인할 수 있습니다.
[코드예제]
get_name()
[결과]
'na10'
마찬가지로 get_age() 를 실행시킬 때마다, 다른 나이가 출력됩니다.
[코드예제]
get_age()
[결과]
23
make_data() 함수를 이용해 age / name 을 각각 5개씩 가지는 (2열 5행) 의 행렬을 만들어보겠습니다.
linspace와 logspace 특정 곡선을 그리듯 일정 간격으로 구성된 벡터값을 생성하기 위한 함수입니다.
linspace : 설정한 범위에서 선형적으로 분할한 위치의 값을 출력합니다.
logspace : 설정한 범위에서 로그로 분할한 위치의 값을 출력합니다.
1_ linspace
a와 b사이에 c개의 점을 생성하기 위한 명령어입니다.
만약에 c가 생략될 경우 → linspace(a, b) 100개의 일정한 등간격을 가진 행 벡터가 생성됩니다.
사용 방법 : np.linspace(a, b, c)
[코드예제]
np.linspace(0, 100, 5)
[결과]
array([ 0., 25., 50., 75., 100.])
2_ log space
a, b, c 을 log scale 등간격인 행 벡터를 생성하는 명령어입니다.
아례 예제처럼 log^a와 log^b 사이에 등간격인 c개의 행벡터를 생성합니다
만약에 c가 생략될 경우 → logspace(a, b) 50개의 일정한 등간격을 가진 행 벡터가 생성됩니다.
사용 방법 : np.logspace(a, b, c)
[코드예제]
# log10(x1)=2, log10(x2)=3, log10(x3)=4 만들기
np.logspace(2, 4, 3)
[결과]
array([ 100., 1000., 10000.])
2. NumPy random
데이터를 생성할 때 랜덤하게 섞거나 임의의 수를 발생시키는 NumPy의 random 서브 패키지로 제공됩니다.
서브 패키지이기 때문에 앞에 항상 np.random.을 써주어야 합니다.
1_ 시드값
seed : 랜덤의 시작 값을 설정
2_ 난수 생성
rand : 균등분포로 난수를 발생(0부터 1사이)
randn : 정규분포로 난수를 발생 (가우시안의 표준 정규 분포)
randint : 균등분포로 정수값을 발생 (균일 분포의 정수 난수)
3_ 데이터 순서바꾸기
suffle : 행렬 데이터를 섞어 줍니다.
4_ 데이터 샘플링
choice : 특정 확률로 데이터를 선택
1_ 시드 값 생성 : seed
: 처음 넘파이를 접하시는 분들은 seed 개념이 어려울 수 있는데 컴퓨터 프로그램에서 무작위 수는 "정말" 무작위가 아니라, 어떤 특정 시작 수를 정해주면 정해진 알고리즘에 따라 난수처럼 보이는 무작위 수열을 만들어줍니다.
이때 시작 수 "seed"라고 합니다.
특정한 시드값이 사용되면 다음에 만들어지는 난수들은 사실 모두 예측할 수는 있습니다.
[코드예제]
# seed는 객체를 바꾸어주는 함수이기 때문에 1 동일한 숫자를 넣었을 경우
# randint로 출력되는 값이 같다는 걸 알 수 있다.
np.random.seed(1)
result1 = np.random.randint(10, 100, 10)
np.random.seed(1)
result2 = np.random.randint(10, 100, 10)
np.random.seed(2)
result3 = np.random.randint(10, 100, 10)
result1, result2, result3
사용법 : np.numpy.choice(a, size=None, replace=True, p=none) - a : 배열이면 이미 있는 데이터로, 정수라면 arange(a) 함수 명령을 통해 데이터를 만듭니다. - size : 샘플을 원하는 갯수 - replace : boolean 으로 true일 경우 선택되었더라 하더라도 데이터를 다시 선택할 수 있습니다. - p : 각 데이터가 선택 될 수 있는 확률입니다 ( 주사위가 각 면이 나올 확률이 1/6인 것 처럼)
자주 사용하는 패키지가 미리 실행되도록 설정해서 항상 패키지를 호출 해야하는 번거로움을 없앨수 있습니다.
"start up 파일 설정 방법"
1. 터미널 에서 아래 코드를 치면ipython 디렉토리에프로필 파일 생성합니다.
$ ipython profile create
2. ipython 디렉토리로 이동한 다음
$ cd ~/.ipython/profile_default/startup
3. ls를 입력하여 폴더의 파일리스트를 확인하면 README 파일을 확인 할 수 있다.
$ ls
4. cat README 를 입력하여 README 내용을 확인합니다.
cat README
여기서 .py 들 앞에 숫자들을 확인할 수 있는데
주피터 노트북을 실행할 때 순차적으로 실행되는 것을 알 수 있습니다.
5. 아래와 같이 입력해 00-first.py 파일을 형성하겠습니다.
$ vi 00-first.py
6. 아래와 같이 필요한 패키지를 모두 입력하고 :wq 를 입력하면 완성됩니다.
# basic
import time
import random
# data analytics
import numpy as np
import pandas as pd
# web crawling
import requests
from bs4 import BeautifulSoup
# visulazation
import matplotlib as mpl
import matplotlib.pyplot as plt
import seaborn as sns
sns.set()
7. jupyter notebook을 실행해서 np를 입력하면(numpy)아래처럼 모듈이 활성화 되어있습니다.
a = 1
b = 1.2
c = True # False
d = "data"
type(a), type(b), type(c), type(d)
[결과]
(int, float, bool, str)
[코드예제]
a + b
[결과]
2.2
[코드예제]
a + d
[결과]
a + d
a + d
---------------------------------------------------------
TypeError Traceback (most recent call last)
<ipython-input-30-4fbab87c839c> in <module>
----> 1 a + d
TypeError: unsupported operand type(s) for +: 'int' and 'str'