UI UX 디자인
-
[인사이트] UX의 심리학의 법칙UI UX 디자인 2022. 3. 23. 18:04
퍼블리의 'UX 디자인 속 심리학 법칙 1편: 사용자 배려하기' 아티클을 읽고 정리했습니다. https://publy.co/content/6671?fr=chapter-bottom-series-list UX 디자인 속 심리학 법칙 1편: 사용자 배려하기 UX 디자인, 심리학에서 답을 찾다 / 1. 힉스의 법칙: UX도 다이어트가 필요합니다 publy.co 1. 힉스의 법칙 - 사용자가 고려해야할 선택지가 늘어나면 선택을 하는데 소요되는 시간도 그만큼 길어진다. > 필수와 옵션 선택지를 모두 노출하지 않는다. > 불가피할 경우 스텝을 나눠서 보여준다. 2. 제이콥의 법칙 - 다른 사이트를 이용하며 축척한 경험을 우리 사이트에서도 기대한다. > 익숙함을 탈피해 변화를 주고 싶을 떄는 반드시 사용자를 배려한다...
-
svg 파일 형식을 사용하는 이유UI UX 디자인 2022. 2. 9. 21:47
https://brunch.co.kr/@ggk234/11 'SVG'를 사용하는 이유! SVG에 대한 이해와 활용법에 대한 설명 | 왜 요즘 수많은 디자이너들은 SVG 아이콘을 쓰는 것일까? 그 이유는 명확합니다. '안 깨지고' '용량이 적고' '출력이 빠름' '수정과 애니메이션이 가능' brunch.co.kr https://ossam5.tistory.com/112 [HTML기초문법] 13강 SVG태그 및 이미지 활용 - OSSAM강좌 1. SVG 태그란? - SVG태그는 Scalable Vector Graphics의 약자로 벡터 기반 그래픽을 XML 형식으로 정의하는 것을 의미합니다. - SVG태그는 SVG그래픽을 담기 위한 요소입니다. - SVG태그 내부에 담을 수 있는 ossam5.tistory.com
-
[Material Design] 구글 머테리얼 폰트(Material Font)와 아이콘(Material Icon) 적용UI UX 디자인 2021. 4. 20. 01:46
fonts.google.com/icons Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 구글에서 제공하는 머테리얼 디자인(material design)! 구글에서 제공하는 머테리얼 폰트(material font)와 아이콘(icon)을 정리해둔 사이트가 있다는 것을 알게 되었습니다! 검색기능도 있고 웹을 위한 코드도 정리되어있어 매우 편리합니다 :) 구글 프레임워크인 플러터 상에서는 바로 아이콘 이름을 입력하면 됐는데 Web에서는 다른 설정이 필요한거 같아 적용해본 뒤 다시 정리해보아야겠습니다!
-
[Material Design] 개발자/ 디자이너가 협업할 때 중요한 Figma 의 주요 기능 (style / component / constUI UX 디자인 2021. 1. 12. 16:18
figma 기능을 잘 활용하면 디자이너와 개발자의 협업을 더 효율적으로 할 수 있다. 개발자 디자이너 협업캠프에서 디자이너님께서 알려주신 내용을 바탕으로 협업할 때 사용하기 좋은 figma의 주요기능과 개발단에서의 관점들을 정리해보았다. Material design을 기반으로 하였으며 자세한 내용은 아래링크의 다큐먼트를 참고하면 된다. 개발 코드 예시는 모두 flutter dart이다. material.io/ Material Design Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital ..
-
이미지 파일 형식 정리 (Image file formats)UI UX 디자인 2020. 6. 17. 17:05
JPG 손실 압축으로 압축률이 뛰어나기 때문에 이미지 용량 줄이는데 용이 표현 색상도가 (24bit)가 좋아 고화질 사진이나 예술 쪽에서 많이 쓰임 PNG 비손실 압축 알파채널이 지원되기 때문에 이미지의 투명도가 필요할 경우 용이 GIF 애니메이션이나 움짤에 용이 8bit만 지원하기 때문에 다양한 색상 구현에 어려움 있음 WEBP JPG PNG GIF를 대체할 수 있는 구글에서 개발한 이미지 포맷 단, 지원하는 브라우저 제한 SVG 벡터 기반의 이미지로 이미지에 대한 정보 저장 - 해상도 영향에서 자유로움 -> 크로스 디바이스 반응형 웹에서 사용 용이 코드나 파일로 이미지 사용가능 - xml 코드 수정으로 간단한 수정 가능하며 Java script로 event handling 가능하다(제어가능하다) 단,..