UI 디자인 : User Interface의 약자로, 제품과 사용자 사이에서 소통할 수 있도록 하는 실체적인 수단이나 매개체주로 화면의 전체적인 구조와 시각적인 요소들을 디자인시각적인 요소 : 레이아웃, 색상, 크기와 정렬, 컴포넌트라고 부르는 버튼, 아이콘, 이미지
와이어프레임부터 핸드오프 과정 전부를 하나의 툴에서 할 수 있는 효율적인 툴 📍Figma 특징 🗺️ 언제나 어디서나 ✓ 웹에서도 사용할 수 있어 접근성이 좋고, 맥과 윈도우 모두 사용 가능🎨 디자인부터 개발까지 올인원 ✓ 디자인 기능 + 개발 관련 기능(종합 협
디자인씽킹 : 논리적으로 제품을 만들 수 있도록 도와주는 프레임워크 중 하나🐚 디자인씽킹 5단계공감하기 Empathy인터뷰나 관찰 등의 다양한 방법으로 사용자와 공감대를 맞추고, 그들의 경험을 완전히 이해하기 위한 노력을 하는 단계문제 정의하기 Define공감으로 얻
📌 합성 컴포넌트 컴포넌트들은 대부분 파운데이션 요소들을 모아 만들지만 파운데이션 요소만으로는 만들 수 없고, 컴포넌트를 모아 또 컴포넌트를 만드는 경우👉 버튼 컴포넌트에 파운데이션 또는 컴포넌트가 여러개 합쳐진 형태👉 대부분 특정한 맥락을 담고 있기 때문에, 컨
우리가 아는 사파리, 크롬, 삼성 인터넷 등을 웹브라우저(Web Browser)라고 부른다.UI는 기능과 목적이 중요! 'UI에 차이가 있다' ⇾ 목적에 차이가 있다는 뜻이고, 목적에 차이가 있다면 UX에서도 차이가 생긴다. 1) 페이지 이동앱 : 임의로 주소를 입력해
시제품디지털 제품에선 실제 제품을 만들지 않고 아이디어를 테스트해볼 수 있는 것구현하는 정도에 따라 낮은 단계와 높은 단계로 나눌 수 있다.✨ 프로토타입을 만들거나 또는 프로토타입을 사용해 테스트하는 것을 프로토타이핑이라고 한다.💡 Lo-fi(Low fidelity)
1) 디자인을 코드로 변환한다.2) 코드는 디자인을 레고처럼 쌓는다.코드는 기본적으로 네모난 박스 영역을 만든다. ⇾ 박스모델3) 웹과 앱은 코드를 읽고, 디자인으로 다시 바꿔서 화면에 보여준다. 📌 따라서 UI를 설계할 때는 코드로 변환할 수 있는 구조로 만들어야