본문 바로가기

분류 전체보기61

[스크랩] 명확하게 디자인하라 - Plus X https://brunch.co.kr/@plusx/45 명확하게 디자인하라 author - 햇님 속눈썹│UX 디자이너 | 안녕하세요. Plus X에 입사한 지 2개월 된 따끈따끈한 신규 입사자, 햇님속눈썹입니다. ᕕ(♨ω♨)ᕗ 플러스엑스의 브런치 글을 읽는 독자에서, '플엑인'으로서 글을 적으려니 묘한 기분이 드네요. 입사 후, 책임님으로부터 『명확하게 디자인하라』라는 책을 전달받았습니다. 오래된 역사를 자랑하듯 책은 아주 너덜너덜한 모습이었는데요. 과연 명서 답습니다. 이 brunch.co.kr 2020. 3. 6.
[Redux] 리덕스를 왜 쓸까 리덕스(Redux)를 왜 쓸까? 그리고 리덕스를 편하게 사용하기 위한 발악 (i) | VELOPERT.LOG 이 포스트는 리덕스의 리도 모르는 독자들을 대상으로 작성된 글입니다. 리덕스가 왜 필요한지 알아보고, 리덕스를 편리하게 사용하기 위한 발악을 한번 해보겠습니다. 리덕스 왜 쓸까? 리액트애서 애플리케이션을 만들 때, 기본적으로는 보통 하나의 루트 컴포넌트 (App.js) 에서 상태를 관리합니다. 예를들어서, 투두리스트 프로젝트에서는, 다음과 같은 구조로 상태가 관리되고 있죠. 리액트 프로젝트에서는 대부분의 작업을 할 때 부모 컴포넌트가 중간자 역할을 합니다 velopert.com 리액트 기초를 공부하며 당췌 이해가 안 가는 부분이 이것이었다. props를 타고 하위컴포넌트를 계속 타고 흘러간다. 흘.. 2020. 2. 21.
온라인쇼핑몰 6개사 메인배너 UI 분석 *국내 대형 온라인쇼핑몰의 대배너 UI 디자인에 대해 비교분석을 해본 글입니다.*대상 : SSG닷컴, 지마켓, 11번가, 쿠팡, 위메프, 티몬 메인배너는 몇 개를 거는 게 좋을까 메인배너는 소비자가 가장 먼저 마주치는 온라인쇼핑몰의 얼굴이다. 그러나 UI 자체로 어떤 특별한 시도하기에는 까다로운 영역이다. 쉬운 사용성, 익숙함과 차별화 사이에서 고민을 해야한다. 또한 최대한 많은 내용을 넣고 싶어하는 사업부의 요구를 어느 정도 선까지 반영할 것인가에 대한 문제도 있다. 전체 배너양이 많으면 많을수록 각 배너당 노출빈도는 떨어진다. 배너가 많으면 많을수록 개당 노출빈도는 떨어진다. 또한 사용성 측면에서 배너를 많이 걸수록 사이트 로딩이 무거워진다. 반대로 전체 배너양을 줄이면 노출상품 종류도 줄어든.. 2020. 1. 19.
[Javascript] 탭 만들기 [원본강의] https://www.youtube.com/watch?v=5L6h_MrNvsk 탭을 짜는 다양한 소스가 있지만 가장 간단해 보이는 소스를 가져왔습니다. 구글링해보면 여전히 제이쿼리 소스 복붙을 많이 하시던데 저는 바닐라 자바스크립트 예제를 고집하고 있어요. 물론 자바스크립트로 소스는 복잡하고 버그가 안 잡힌 예제도 많더라구요. 이 예제는 dataset을 사용하는 방식이라 간단한 반면, IE 10 이하는 지원이 안 된다는 단점이 있습니다. 하지만 공부하는 입장에선 레거시를 신경쓰기보다는 최근 기술로 공부하는게 좋겠죠! [Codepen 소스보기] https://codepen.io/jisuny/pen/RwNGKMN?editors=1111 위 링크는 제가 커스텀해 본 코드입니다. 강의 속 CSS가 .. 2019. 12. 14.
[스크랩] UX 디자이너는 코딩을 배워야 할까 UX 디자이너는 코딩을 배워야 할까디지털 서비스 디자이너는 반드시 코딩을 배워야 한다. 코딩을 잘 한다고 훌륭한 디자이너가 되지는 않지만, 훌륭한 디자이너가 되려면 코딩을 반드시 배워야 한다. 대학의 디자인 학과에서도 코딩을 반드시 가르..story.pxd.co.kr 디자이너로서 내 강점과 정체성이 무엇을까 생각해본다. 예전엔 드로잉 능력을 어필했는데 최근엔 "저는 코드에 친숙한 디자이너입니다!" 를 어필하는 캐릭터로 잡고 있다. 성과가 얼마나 돌아올런진 모르겠지만...'코드에 친숙하다'고 표현할 때 개발 대신 코드라는 단어를 사용한 이유는,1. 개발을 못한다. (브라우저의 단순 인터랙션과 CRUD의 R만 가능하다.) 2. 내가 하는 걸 함부로 개발로 승격시키고 싶지 않다. 포토샵을 다룰 줄 안다고 디자.. 2019. 12. 5.
[React] Component와 Props https://ko.reactjs.org/ 공식 사이트가 설명이 잘 되어 있어서 이걸로 공부를 하기로 했다. 다행히 한국어로 잘 번역되어 있다. 우선은 주요개념 파트를 마스터하는 것이 중요하다. 1. Hello World 2. JSX 소개 3. 엘리먼트 렌더링 4. Component와 Props 5. State와 생명주기 6. 이벤트 처리하기 7. 조건부 렌더링 8. 리스트와 Key 9. 폼 10. State 끌어올리기 11. 합성 vs 상속 12. React로 생각하기 총 12가지 문서로 되어 있고 이 12가지 개념을 익히면 리액트의 큰 줄기는 다 훑는 것이라고 한다. 물론 이것 또한 초보자에게 친절하다고는 말하긴 힘들다. 차근차근 설명하다가 어느 순간 "예시를 보여줄테니까 나머지는 니가 혼자 이해해봐.. 2019. 10. 24.