웹/UIUX 공부24 iOS 디자인과 안드로이드 머티리얼 디자인 가이드의 특징 iOS 디자인의 간단한 변천사와 플랫 디자인의 특징, 안드로이드 구글 머티리얼 디자인 가이드의 특징에 대해 요약해보았습니다. 본격적인 디자인을 제작하기에 앞서, 지금까지의 UIUX 디자인 종류는 어떤 것이 있었는지 앞으로 어떤 디자인을 추구해야할지 정리해보는 시간을 가져보겠습니다. 이전에는 iOS와 안드로이드 이 두가지 모바일 운영 체제에 의해 모바일 UIUX 디자인이 양분화되었었습니다. 이에 따라서, 모바일 콘텐츠를 만들때 그 운영체제가 가이드하는 디자인을 따르는 식이었죠. 그러나 이제는 각 운영체제별로 확연히 구분되기 보다는, 각자의 장점을 차용한 디자인이 발전되고 있습니다. 각각의 디자인 가이드에는 장단점이 있으므로, 살펴보신 후 표현하려고 하는 서비스의 상황에 따라서 유동적으로 사용하는 것이 좋겠.. 2022. 5. 16. 메뉴 트리, 정보구조도 작성 방법 정보 구조 설계에 해당하는 메뉴 트리, 정보 구조도(IA) 작성은 기획과 디자인 두 분야에서 통용되는 단계입니다. 기획자 뿐만 아니라 디자이너도 이와 같은 내용을 알면 디자인을 설계하고 표현하는데 있어서 매우 효율적인 작업을 할 수 있습니다. 이러한 정보 구조 설계를 마친 이후에 화면이 어떻게 보여지는지 와이어 프레임, 프로토 타이핑을 진행할 수 있습니다. 정보 구조를 설계하는 것의 핵심은, 사용자가 편리하게 이용할 수 있게 정보를 구성하는 것입니다. 어떤 구조가 사용자가 이용하기 편리한지 판단하는 근거는 디자인 리서치와 모델링, 아이디어 도출, 사용자 시나리오 등 지난 글들을 통해 알 수 있습니다. 이에 따라 사용자 경험을 이해하고 정보를 해체하고 재조합하면서, 논리적인 탐색 구조를 설정하도록 해봅시다.. 2022. 5. 16. W3C 웹 표준, 웹 접근성 연구소 체크리스트 정리 웹 표준을 준수하여 웹 접근성을 높일 수 있도록, W3C 권고안과 웹 접근성 연구소 지침을 정리해보았습니다. 웹 표준은 세계적인 기관인 W3C에서 웹을 제작할 때 권고하는 표준 권고안이며, 웹 접근성은 웹 표준을 지킴으로서 향상됩니다. 0. 웹 표준, 웹 접근성을 신경써야하는 이유 그럼 웹 접근성은 왜 향상되어야 할까요? 우리가 웹 표준을 지켜야하는 이유는 다음과 같습니다. 다양한 환경(브라우저, 기기, 상황)에서 접속할 수 있습니다. 사용자 입장에서는 필요한 정보를 손쉽게 검색해서 접근할 수 있습니다. 제작자 입장에서는 따로 홍보를 하지 않아도, 검색에 쉽게 노출되어 광고 비용을 줄일 수 있습니다. 웹 접근성은 모든 사용자가 신체적인 조건, 교육 수준, 환경적인 조건에 상관없이 웹에 접근할 수 있는 정.. 2022. 5. 12. 인터렉티브한 웹사이트를 만드는 방법, 참고할만한 사이트 인터렉티브한 웹사이트를 모아봤습니다! 버튼을 누르거나, 마우스를 드래그 또는 스크롤했을때 어떤 반응이 나타나는 것을 좋아하시나요? 대화형 UI는 사이트의 참여도를 높이는데에 아주 효과적이고, 게임을 만들 수도 있습니다. 참고할만한 사이트 목록을 확인하고 영감을 얻어보세요. 누르면 반응하는 것들을 좋아하시나요? 저는 좋아합니다. 인터렉티브한 웹사이트를 만드려고 할 때 알아두면 좋을 사이트들을 정리해보았습니다. 인터렉티브한 웹사이트를 만드는 방법 1. 인터렉션 관련 소스, 플랫폼 깃허브를 통해 소스를 분석할 수도 있지만, 여러가지 실험들을 보면서 프로젝트 아이디어를 생각하기에도 좋습니다! Chrome 실험(크롬에서 할수있는 여러 시청각적 실험) 구글크리에이티브랩_깃허브 구글크리에이티브랩_텍스트를 음성으로 변.. 2021. 12. 24. 웹&앱 서비스 기획 커뮤니티와 공부 참고, 도구 목록 웹&앱 등의 서비스를 기획 커뮤니티와 공부할 때 참고가 되는 사이트, 도구 등을 정리해보았습니다. 어떤 일이든 인터넷에서 자료를 찾지 못하는 분야는 드문데요. 기획은 정답이 없는 분야 중의 하나이기 때문에, 그만큼 많은 것을 보고 느끼고 생각을 나누는 것이 중요하다고 생각합니다. 따라서 제가 기획을 공부할 때 알아보았던 사이트들을 소개합니다. 기획을 공부하시거나 기획 관련 직무를 하실때 참고하셔서, 이 글이 도움이되었으면 합니다! 웹&앱 서비스 기획 커뮤니티 웹만사. www를 만드는 사람들(네이버 카페) 기마사. 기획과 마케팅을 하는 사람들(네이버 카페) 웹/모바일 기획자 그룹(페이스북 그룹) 힙한 서비스들의 비밀(페이스북 그룹) 기획 공부에 참고하면 좋은 블로그&사이트 노노니(웹만사 운영진 블로그) I.. 2021. 12. 24. 웹 UX 디자인을 좋게 만드는 8가지 방법 UX 디자인이라고 아시나요? 웹 디자인에서 가장 중요한 요소는 편리한 탐색, 간결하고 효과적인 페이지, 링크, 그리고 좋은 콘텐츠입니다. 전부 사용자를 배려하기 위한 요소들이죠. 지난 시간에는 웹디자인 뿐만 아니라 모든 디자인 분야에 적용되는 디자인 원칙에 대해 이야기했었습니다. 2021.12.08 - [기획] - 꼭 알아야할 웹디자인 기초 원칙 6가지 꼭 알아야할 웹디자인 기초 원칙 6가지 웹디자인 기초에 대해 알기 위해 디자인 구성 원칙 6가지를 설명합니다. 모든 디자인에 통용되는 이론이므로 알아두시면 좋습니다. 좋은 웹디자인은 미적으로도 즐겁고, 사이트의 실적에 즉각 cucat.tistory.com 이번엔 좀 더 범위를 좁혀서, 웹사이트에서 사용자의 경험과 연관된 디자인에 대해서 얘기해보겠습니다. .. 2021. 12. 8. 꼭 알아야할 웹디자인 기초 원칙 6가지 웹디자인 기초에 대해 알기 위해 디자인 구성 원칙 6가지를 설명합니다. 모든 디자인에 통용되는 이론이므로 알아두시면 좋습니다. 좋은 웹디자인은 미적으로도 즐겁고, 사이트의 실적에 즉각적인 변화를 줄 수 있습니다. 웹을 디자인할 때 어떤 포인트로 디자인해야 하는지 살펴보겠습니다. 이 글은 기본적으로 웹사이트를 운영하려고 하는 비전공자를 대상으로 하지만, 경험이 많은 디자이너들도 의외로 모르는 사실이 있을 수 있으니 잘 읽어주세요. 웹디자인 기초 - 디자인 구성 원칙 좋은 웹 디자인은 일반적인 좋은 디자인과 동일합니다. 좋은 디자인이 무엇인지 이해한다면, 웹사이트에 그 규칙들을 적용할 수 있을 것입니다. 1. 레이아웃 레이아웃은 페이지의 요소 배치 방식이며 이미지, 텍스트, 탐색 등을 위한 기초입니다. 따라.. 2021. 12. 8. 가장 많이 쓰이는 웹사이트 레이아웃 10가지 웹사이트 레이아웃을 고르는 것은 간단한 일이 아닙니다. 사이트에 어울리는 올바른 레이아웃을 선택하면 좋은 사용자 환경을 제공할 수 있습니다. 이 글에서는 사용자에게 친숙한 최고의 레이아웃 10가지를 소개합니다. 또한 사이트의 종류에 따라 적합한 레이아웃을 설명해드립니다. 익숙한 레이아웃은 사용자가 사이트를 편하게 사용하고, 계속 사이트를 이용할 수 있도록 합니다. 따라서 웹디자인을 할 때 참고할 수 있는 친숙한 웹사이트의 레이아웃 10가지를 소개해드리려고 합니다. 레이아웃 디자인이란? 웹 사이트의 페이지 레이아웃은 웹 사이트가 어떻게 구성되는지에 대한 디자인입니다. 웹사이트의 청사진이라고 생각하세요. 청사진이 건물의 모양(방 위치, 벽 위치 등)을 결정하는 방법처럼 레이아웃은 사진, 텍스트, 로고 등 모.. 2021. 12. 7. 이전 1 2 3 다음
