# UI

23개의 포스트
post-thumbnail

IM _ HTTP & Server

goal클라이언트APISERVERWeb Architectures클라이언트, , API 가 무엇인지 정의 내릴 수 있다.웹 개발과 관련한 아키텍처를 이해할 수 있다.Browser의 역할을 이해할 수 있다.Browser와 서버와의 연결이 어떤 규약(protocol)을 통해

2020년 11월 13일
·
0개의 댓글

React Native UI 개발 시작

현재 앱 출시를 목표로 UX 기획자로 참여하고 있는 프로젝트에서 Figma로 와이어프레임을 시각화하고 필요시에 인터랙션을 연결해서 커뮤니케이션하고 있는데 한계를 느꼈다. 평소에 모바일 프론트앤드 개발에 도전하고 싶었기도 해서 이참에 앱 개발 환경인 react nati

2020년 11월 5일
·
0개의 댓글
post-thumbnail

Expanded vs SpaceAround 차이점

하나의 Row나 Column위젯에서 두개 이상의 버튼이나 이미지를 정렬을 하고 싶을 때 두가지 방법을 쓸 수 있다. 결론부터 말하자면 아이콘의 정렬위치는 같으나 차지하는 크기가 달라진다. 즉 클릭할 수 있는 범위가 달라진다. 아래의 코드와 사진 참조.

2020년 11월 5일
·
0개의 댓글

201005 TIL React

JSX React.js 는 JavaScript 라이브러리입니다. 라이브러리는 기능 단위의 반복적으로 사용될 수 있는 코드를 모아둔 것입니다. 비교적 사용 목적이 프레임워크에 비해 자유롭고, 가볍습니다. React는 UI 관리의 편리성을 위해 Facebook에서 개발한

2020년 10월 11일
·
0개의 댓글
post-thumbnail

TIL 2020.04.05

2020년 9월 30일
·
0개의 댓글
post-thumbnail

UI vs UX 디자인

UI는 좀 더 시각적이고 그래픽 디자인과 더 밀접 한 관련이 있고, UX는 보다 분석적 이다.

2020년 8월 24일
·
0개의 댓글
post-thumbnail

빠르게 배우는 Vue.js

한창 상승 중인 Front-End를 위한 JavaScript Framework인 Vue.js를 시작하기 앞서 먼저 Vue.js에 대해 알아보고 개념을 잡고 시작하자.먼저 Vue.js에 대해 기본적인 개념부터 알아보고 다음 포스팅부터 실제로 만져 보면서 학습해보자.Vue

2020년 8월 5일
·
0개의 댓글
post-thumbnail

2020 UI/UX 디자인 트랜드

2020 UI/UX 디자인 트랜드! 트랜드를 파악할 수 있는 프론트엔드 개발자가 되자!?!

2020년 7월 28일
·
0개의 댓글
post-thumbnail

UI, UX

프론트엔드에서 가장 관심이 많은 용어인만큼 뜻을 정확히 알고 있자!

2020년 7월 28일
·
0개의 댓글
post-thumbnail

Android User Interface(계층적 구조)

오늘 제가 다룰 이야기는 안드로이드의 뷰 계층 구조입니다. 그럼 뷰 계층 구조를 다루기에 앞서 사용자 인터페이스란 무엇일까요?사용자에게 컴퓨터를 편리하게 사용할 수 있는 환경을 제공하는 설계내용을 뜻합니다.레이아웃들의 집합입니다. 쉽게 말해, 사용자들의 눈에 보이는 화

2020년 7월 10일
·
0개의 댓글

UI / UX 란?

UI / UX에 대해 아직 제대로 모르는 것 같아 정보들을 찾아 간단히 정리해보고자 한다. 간략하게 말하자면 UX는 경험이고, UI는 이 경험을 실현시키는 수단이다. 카카오톡은 채팅이란 경험들 제공한다. 채팅이란 경험을 제공하기 위해 App이라는 수단을 사용한다.

2020년 6월 20일
·
0개의 댓글
post-thumbnail

[TIL] 20.06.15 과제,책,블로그에서

상당량의 과제들이 추가되었다.😊🙂🤔🤨😐🙄😣

2020년 6월 15일
·
0개의 댓글
post-thumbnail

Vanilla JS로 짱깸뽀(가위 바위 보) 게임 만들기

바닐라 자바스크립트로 만든 추억의 짱깸뽀 게임이다.시작 버튼을 눌러 게임 시작게임을 한판 할 때 마다 하단의 코인이 하나씩 소모됨룰렛 주변으로 게임 결과가 표시 됨승리할 경우 랜덤으로 코인이 지급짱깸뽀 사운드를 추가해야 하는데 구하기가 쉽지 않음여기를 클릭하면 게임 화

2020년 6월 6일
·
0개의 댓글
post-thumbnail

핀터레스트 레이아웃 구현하기

핀터레스트 레이아웃 사용시 자바스크립트만으로 구현이 가능하다. Masonry 플러그인을 활용하면 좀더 다양한 인터렉션을 활용할 수 있지만 성능 및 블록 틀어짐 이슈 때문에 자바스크립트만 활용하였다.현재 화면에 나열된 요소들의 부모를 기준으로 posirion: absol

2020년 6월 6일
·
0개의 댓글
post-thumbnail

UI 디자인 경험상 법칙 정리

https://uxdesign.cc/10-rules-of-thumb-in-ui-design-aa5f91885444 를 정리단순히 법칙은 아니고 경험상 디자인 작업에 도움이 될만한 규칙들을 정리했다.익숙하지 않는 경우 밀도는 화면이나 ppi 1인치 당 픽셀 수

2020년 5월 10일
·
0개의 댓글

Skeleton UI

요즘 skeleton이 매우 핫합니다.Loading Indicator를 보여주는 방법에는 여러가지가 있습니다.그 중 대중적인 두 가지를 살펴 보겠습니다.Loader1Skeleton2여러분은 두 가지 중에 어떤게 마음에 드시나요?제가 속마음을 읽어보자면 두 번째를 고르신

2020년 5월 4일
·
0개의 댓글

사용자 인터페이스

사용자 인터페이스(UI) : 사용자와 시스템 간의 상호작용이 원활하게 이뤄지도록 도와주는 장치나 소프트웨어를 의미 초기의 UI는 단순히 사용자와 컴퓨터 간 상호작용에만 국한되었지만 요즘에는 기능 위주로 변경, 최근에는 정보 내용 전달 위한 표현 방법이다.

2020년 4월 20일
·
0개의 댓글
post-thumbnail

너의 UX에도 다 계획이 있구나! - 1

여러분의 UX는 안녕하신가요?

2020년 4월 6일
·
0개의 댓글
post-thumbnail

Debounce와 Throttle: 효과적으로 이벤트 핸들링하기

Debounce와 Throttle은 자바스크립트 이벤트를 (양적인 측면에서) 효율적으로 처리하기 위한 방법입니다. 이러한 컨트롤이 필요한 경우의 예를 들기 위해, 이전에 만들었던 페이지를 가져와 보겠습니다. 예전에 만든 회사 홈페이지 직접 개발한 가로 스크롤형 홈페이지

2020년 3월 19일
·
0개의 댓글
post-thumbnail

Anime.js 사용하기

Vue.js 프로젝트에서 애니메이션의 손쉬운 구현을 위해 Pure JavaScript Library인 Anime.js 라이브러리를 사용하는 방법에 대해서 알아봅니다. 다양한 기능이 있지만 단일 DOM 객체를 움직이는 기능을 중점적으로 서술하였습니다.

2020년 3월 19일
·
0개의 댓글