티스토리

ONE-OFF

검색하기

블로그 홈

ONE-OFF

1-off.tistory.com/m

jaewon_jang 님의 블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

인터렉션 디자인의 이해 이번 강의는 가장 흥미롭게 느껴지는 강의이다! 인터렉션은 늘 재밌고 흥미진진하다. 움직이는 애니메이션이 생동감을 만들어내고 지속적으로 보게 된다 하지만 내가 알고 있는 인터렉션은 여기까지였다. 플러스엑스에서 얘기하는 인터렉션은 사전적 의미까지 생각하였다. 인터렉티브(~사이에) 액션(행동)이 결합된 상호작용의 뜻을 가지고 있다. 대략적으로 그럴 것이라고 생각했었는데 사물과 개체가 서로 연결되고 그것을 보고 행동을 통해 프드백이 온다는 것을 설명해주었다. 그러면서 일상 속 예시까지 들어 이해도를 더욱 높였다. 방의 불을 끄고 키는 버튼 혹은 선풍기를 조작하는 버튼, 에어컨을 조작하는 리모콘 등 우리 일상 속 많은 인터렉션 요소들이 많이 있었다. 이 외에도 향도 될 수 있다고 생각하다. 이런식으로 공간은 많은.. 공감수 0 댓글수 0 2023. 8. 11.
프로젝트 완료 이후의 협업 이번 강의는 프로젝트 완료 이후 협업은 어떤식으로 이뤄지는지 설명하는 강의였다. 플러스엑스는 마지막까지 섬세하고 디테일하게 프로젝트를 관리하고 있었다. 최종 산출물이 제대로 된 방향으로 가는지 확인하기 위해 중간 산출물들을 관리하였고 전략 / 설계 / 디자인 가이드 등 각각 폴더를 분류하고 관리하여 최종적으로 파트너사에게 파일을 압축하여 전달하였다. 전달하는 방식은 구글 드라이브와 외장하드 등 다양한 방식을 소개해주었다. 최종적이 체크가 중요한 만큼 더욱더 세심하게 관리하는 것 같다. 그리고 한가지 더 재밌었던 점은 구성원에게 프로젝트가 종료 됨을 알리는 메일을 보낸다는 것이였다. 이건 파트너사에게 전달하기 전에 진행하는 과정인데 전략문서, 설계서, 디자인 시안, 가이드 등에서 누락된 것이 없는지 링크,.. 공감수 0 댓글수 0 2023. 8. 10.
QA 이번 강의는 기획, 디자인, 개발이 다 진행 된 이후 점검해야 할 부분을 체크하는 강의를 들을 수 있었다. 이러한 QA없이 프로젝트를 마무리하게 되면 추후에 발생한 문제들이 다수 있기 때문에 미리 문제를 방지하고 프로젝트의 질을 더욱더 올려주는 것이라는 것을 배우게 되었다. 특히 결제 관련 서비스의 경우 금액이 다르거나 결제가 다르면 또 다른 큰 문제를 일으킬 수 있기 때문에 이 부분은 잘 염두해두어서 안정성을 기반으로 QA를 살펴보아야한다. 편집디자인에서 다시 글을 검토하는 것과 같은 결이라는 생각이 든다. 그리고 파트마다 진행한 업무가 있기 때문에 파트별로 분담하여 이슈를 찾아낸다고 한다. UI디자이너, UX디자이너, 개발자가 각각 맡은 업무에 대한 이슈를 체크하고 시트를 공유하는 것을 알 수 있었다.. 공감수 0 댓글수 0 2023. 8. 9.
네이밍 룰 이번 강의 실질적으로 도움이 많이 되는 강의였다. 각 파트마다 작업 이전에 의견을 나누고 합의점을 만들어야가하는데 이 부분을 어떤식으로 만들어갈지 소통을 어떻게 해야할지 알려주는 강의였다. 그 중 네이밍 룰을 통해 파일 공유시 파트마다 혼란스럽지 않고 이해할 수 있도록 룰을 만든다는 것이였다. 특히 UI 디자이너는 다른 파트와 더 많이 소통을 해야하기 때문에 네이밍 룰을 잘 지켜내는 것이 중요한 것으로 보인다. 폴더 네이밍 룰 디자인 제작 시 정말 많은 파일들이 생성이 되는데 학교 때는 날짜와 프로젝트명, 속성으로만 네이밍을 했었다. 하지만 실무에서는 달랐다. 다른 파트와도 소통을 하기 때문에 네이밍이 분명하게 어디에 위치하는지 알려줘야 했다. 그리고 새로운 프로젝트 진행시 나는 날짜로 프로젝트를 넣어놨.. 공감수 0 댓글수 0 2023. 8. 6.
협업 강의는 협업의 가치와 중요성에 대해 설명하고 있고 협업을 잘하기 위한 방법들을 제시하고 있다. 기획, 디자인, 개발이 필요한 프로젝트는 서로 간 일의 효율성을 극대화 하기 위해서 협업이 중요하다는 것을 강조하고 있다. 웹이나 모바일을 대상으로하는 프로젝트는 하나의 분야로만 제작할 순 없다. UX팀이 소비자의 원활한 사용성을 위해 리서치하고 그것을 바탕으로 UI팀이 크리에이티브한 사고방식을 더해 시각적으로 표현한다. 표현 된 디자인은 DX팀에서 실제 구현이 가능한지를 테스트해야한다. 총 3개의 팀이 서로 의견을 나누고 소통하며 공유하기 때문에 협업방식을 매우 중요하다는 생각을 한다. 만약 팀 내부의 협업이 제대로 이뤄지지 않으면 프로젝트 진행 도중 전면 수정하고나 초기 설계 단계부터 해야 할 수 있었다고 .. 공감수 0 댓글수 0 2023. 8. 5.
Plus X와 구성요소 플러스엑스가 사용하는 UI의 구성요소를 살펴볼 수 있는 강의였다. 포인트 컬러는 얼마나 사용하고 복잡성을 줄이기 위해 폰트의 규칙은 어떻게 세우는지 알 수 있었다. 컬러는 많이 사용할 필요는 없었고 포인트 컬러와 서브 컬러를 몇개로 나눠어서 설정하였고 폰트는 크기와 두께를 계단형식으로 나열하는 것을 볼 수 있었다. 또한 영문과 국문 사용시 한가지 폰트로만 사용하고 영문은 특징이 되는 부분만 함께 사용하는 것을 배웠다. 웹 서핑시 이런 사항들이 어떻게 이뤄어지고 있는지 살펴보면 좋을 것 같다는 생각을 한다. 그리고 플러스엑스만의 작업들은 개성있고 독특한 인상이라는 느낌을 많이 주는데 그 바탕에는 이러한 기본은 바탕으로 하여 디자인을 설계해 나아가는 것 같다. 플러스엑스 프로젝트 커머스를 진행한 예시를 보여.. 공감수 0 댓글수 0 2023. 8. 4.
구성요소의 이해 본격적으로 UI의 각각의 요소가 어떤 역학을 하는지 왜 필요한지에 대해 배울 수 있는 강의였다. 컬러의 코드 명칭, 컬러 시스템, 메인컬러와 서브컬러의 비중과 블랙 화이트의 계층구조 등을 낱낱이 살펴볼 수 있었다. 폰트를 사용할 때 최적화 된 폰트로 시스템 폰트를 사용한다 것도 알게 되었다. 시스템 폰트로 사용하게 되면 따로 다운받지 않고도 공통적으로 폰트를 사용할 수 있기 때문에 여러 사람이 함께 디자인하는 시스템 환경에서는 용이하다고 생각된다. 또한 추후에 브랜드나 기업의 내부자들이 언제든 부담없이 사용이 가능할 것 같다는 생각이 든다. 버튼 라인과 면, 면의 라운드 등의 차이를 둬 구분을 해야한다고 한다. UI은 각각 역할이 있기 때문에 사람들이 봤을 때 명확하게 차이점이 들어날 수 있도록 해야하는.. 공감수 0 댓글수 0 2023. 8. 3.
[PlusX Share X Fastcampus] UI 구조의 이해 구조 웹과 앱은 단순하게 이뤄어지지 않다. 다양한 요소들이 모여 만들어진다. UI 제작시 고려해야 할 특성은 조직성과 일관성이라고 설명해주 고있다. 일관성은 이해하였지만 조직성이라는 말이 잘 이해가 되진 않았다. 하지만 강의를 다 들은 후에는 어떤 것을 의미하는지 알게되었다. 웹과 모바일의 공통적인 모습을 보면 인간의 모습과 비슷하다고 느낀다. 헤더, 컨텐츠, 푸더로 구성이 되어있는게 크게 머리, 몸, 발로 되는 것과 비슷한 것 같다. 그리고 영역의 명칭이 디자인과 개발의 차이가 있다는 것도 알게되었다. 이렇게 간단하게 명칭을 이해하고 있으면 개발자와 소통시 도움이 될 것 이라고 예상한다. 헤더 UX 설계나 서비스 성격에 따라 헤더의 모습이 달라지는 사례를 살펴볼 수 있었다. 네비게이션만의 기능만 하거나.. 공감수 0 댓글수 0 2023. 8. 2.
[PlusX Share X Fastcampus] 그리드 플러스엑스는 최소한의 규칙와 기준의 그리드를 설정해 디자인 배치에 대한 제한을 두지 않게 설계한다는 것을 파악할 수 있었다. 나는 항상 무조건 정해진 그리드에 칼럼에 맞춰 디자인을 해야한다고 생각했다. 하지만 PC, 태블릿, 모바일에 따라 언제든지 그리드와 레이아웃은 변경될 수 있다는걸 알게되었다. 반응형과 적응형에 따라 그리드의 변경 여부는 고려해서 적용시켜봐야겠다. 구글 머터리얼 디자인 가이드에서는 8의 배수를 권장하여 사용하도록 되어있는데 숫자는 디자인에 제한을 줄 수 있기 때문에 적절한 상황에서 숫자가 변경 되는 방법도 고려 요소 중 하나 인 것을 알게되었다. 웹이라고 해서 정해진 숫자와 크기, 가이드, 레이아웃으로만 진행된다면 진부하고 창의적인지 못한 설계가 될 수 있다고 생각된다. 그리고 그리.. 공감수 0 댓글수 0 2023. 8. 1.
[PlusX Share X Fastcampus] 레이아웃에 대한 이해 칼럼 UI의 단(칼럼)에 따라 이미지, 텍스트양이 보이는 것이 다르고 모바일과의 연결이 쉬운지 아닌지를 알게 된 강의 또한 시선동선에 따라 재미요소를 전달할 수 있고 없고가 있다 디지털 레이이웃은 편집디자인과의 약간의 차이가 있는 것 같다 스크롤 형식의 디지털 레이아웃은 사용자와의 상호작용하는 부분까지 생각해야 되는 것 같다 즉 체류시간을 얼마나 확보 할 수 있는지를 생각하고 레이아웃을 구성해야 하는 것 같다! 그리고 위계에 대해서도 강의는 설명해 주고 있다 디자인의 기초적인 부분이기에 가장 먼저 보여줘야 할 것과 그 다음으로 중요한 것들의 위계가 잘 되어있어야 보는 사람이 편리하고 한 눈에 핵심정보와 부가적인 정보 확인이 가능할 것이다 게슈탈트 이론 같은 형태와 모양을 인식하는 사람의 심리에 대한 강의.. 공감수 0 댓글수 0 2023. 7. 31.
[PlusX Share X Fastcampus] 그리드에 대한 이해 그리드는 규칙성을 부여하기 위해 설정하는 시스템이라는 것을 배운 시간이였다. 편집디자인부터 UI까지 그리드는 언제든지 사용될 수 있다고 한다. 인쇄와 다른 UI는 마진, 칼럼, 가터라는 용어를 사용한다. 양쪽 여백의 마진 값을 먼저 설정 후 나머지 공간에서 디자인을 구성하면 된다고 한다. 그리고 해상도마다 컬럼의 갯수가 다르게 설정 된다는 것을 알았다. 대중적으로 많이 사용하는 1920의 경우 최소4개, 최대 12칼럼을 사용할 수 있다고 한다. 홀수가 아닌 짝수로 하는 이유는 균형값 때문이지 않을까 하는 생각이 든다. 8포인트 그리드 지나가다 한 번 쯤은 들어본 용어였지만 자세히 알지 못했다. 왜 8포인트 그리드를 사용하는지 어떤 경우에 사용하는지 강의를 통해 알게 되었다. 8의 배수로 했을 때 좀 더 .. 공감수 0 댓글수 0 2023. 7. 30.
[PlusX Share X Fastcampus] Plus X와 해상도 해상도는 파트너사가 제공할 때가 있고 에이전시 측에서 해상도를 결정할 때가 있다는 것을 알게 되었다. 또한 기준이 되는 메인 해상도를 설정을 위해 검토하는 부분을 크게 4가지로 나눈다고 한다. 작업 성격, 서비스 환경, 메인 플랫폼, 리소스 구성로 나뉜다. 이러한 기준이 있다면 해상도 설정 이후 수정되는 일이 줄어들 것이라 생각된다. 작업 성격 제안과 구축으로 나뉜다. 제안은 말 그대로 파트너사에게 새로운 컨셉과 방향을 제시하는 것이다. 구축은 여기에 개발까지 이어지는 과정이다. 2가지의 공통 된 과정은 시안 제시후 피드백 반영 수정 후 최종적으로 전달이다. 구축은 여기에 더 나아가 개발 가이드를 작성해 작업을 진행하다는 것이다. 궁금한 점은 제안에서는 해상도 설정 시 에이전시 측 입맛에 맞는 설정을 한.. 공감수 0 댓글수 0 2023. 7. 29.
[PlusX Share X Fastcampus] UI 디자인 기초 지식 이전 강의에서는 UI 디자이너의 기초 사고에 대한 생각을 해보았다면 이번 강의는 실제로 디자인시 필요한 기초 지식에 대한 것을 알 수 있게 되었다. UI디자인을 할 때 사실 기준 없이 마구잡이로 진행했었다. 대충 웹사이트에서 해상도 사이즈를 찾거나 핀터레스트에서 디자인만 된 레퍼런스를 찾아서 디자인을 진행하고 했었다.. 그냥 내가 마음에 끌리는대로 했었는데 이 강의에서 그런 부분을 콕 집어서 방향을 제대로 잡아주었다. 어쩌면 알 고 있었지만 무심코 넘어갔을 수 도 있다. 좀 반성을 하게 되는 시간이였다. 어쨌든 다시 본론으로 돌아와 강의에서 말하는 기초 지식은 크게 해상도, 그리드&레이아웃, 엘리먼트라고 얘기한다. 우리가 책을 만들기 위해서는 책 사이즈에 따른 이미지, 타이포그래피 배치와 크기 등 을 알.. 공감수 0 댓글수 0 2023. 7. 26.
[PlusX Share X Fastcampus] Ui 기초 디자인 UI 디자이너가 갖춰야할 기초 지식에 관한 오버뷰 강의이다. 제품이나 서비스에 구성되어 있는 디자이너는 크게 브랜드, 제품, 건축, UI, 패션, 패키징 등 으로 구성이 되어있다. 각각의 역할과 특성에 따라 디자이너의 스킬이나 해야 할 리스트와 구축되는 환경이 다르다고 생각된다. 플러스엑스가 말하는 UI 디자이너의 환경은 온라인을 기반으로 구성이 되는 것이다. User Interface Interface의 사전적 정의를 찾아보면 서로 다른 두 개의 시스템, 장치 사이에서 정보나 신호를 주고받는 경우의 접점이나 경계면이다. 라고 나와있다. 사용자가 쉽게 기기를 동작시키는데 도움을 주는 시스템인 것이다. 디지털 환경에 따라서 UI디자인의 시각적인 요소를 달라진다. 화면에 보이는 버튼부터 이미지까지 사용자가 .. 공감수 0 댓글수 0 2023. 7. 25.
[PlusX Share X Fastcampus] Plus X, UI PR 이번 강의는 플러스엑스가 파트너사나 불특정 다수에게 자신의 작업을 전달하는 PR에 대해서 배우게 되었다. PR 방식은 디지털 현대사회인 만큼 소셜네트워크를 이용하여 진행하고 있었다. 웹사이트, 비헨스, 인스타를 통해서 PR을 진행하였다. 웹사이트는 브랜드 혹은 기업이 가진 정체성을 보여주는 가장 좋은 매개체라고 생각된다. 스토리부터 브랜드가 가진 방향성, 작업, 제품, 서비스를 한 공간 안에서 살펴 볼 수 있기 때문이다. 그래서 웹사이트를 제작할 때 아이덴티티가 잘 나타날 수 있도록 디자인이 구성되어있어야 한다고 생각된다. 비헨스 PR 방식에서는 영문으로 프로젝트를 설명한다고 한다. 이는 비헨스의 특성을 잘 반영시킨 전략이라고 생각된다. 세계 각국의 나라에서 비헨스를 사용하기 때문에 영문을 통해 PR을 .. 공감수 0 댓글수 0 2023. 7. 24.
[PlusX Sharex Fastcampus] UI 구축 프로세스 제안된 디자인을 기준으로 ui를 구축하는 단계를 설명하는 강의이다. 폰트 스타일을 이렇게 세부적으로 관리하는지는 알고 있었지만 정리 된 가이드를 본 적이 없었다. 그래서 어떤식으로 정리를 해야 할 지 알 수 있게 되었다. 이렇게 관리하면 디자인이나 개발자가 편리하게 소통이 가능하고 통일성을 충분히 전달 할 수 있다. 디자인은 한 번에 만들어지지 않고 여러번의 수정을 거치는데 그럴 때마다 가이드가 없게 된다면 유지보수시 어려움을 겪게 될 것이다. 상세설명서를 볼 때마다 ui은 정말 디테일하게 구축된다는 것을 느낀다. 상호작용하는 시스템이기 때문에 세부적으로 구성이 되는 것이라 생각된다. 정보를 정리하고 쉽고 편리하게 만드는 것을 망각하지 않고 디자인을 해야 겠다는 생각이 든다. 시각적 규칙성을 만들어 사용.. 공감수 0 댓글수 0 2023. 7. 23.
[PlusX Sharex Fastcampus] UI 제안 프로세스 이번 강의는 파트너사와 프로젝트 진행시 준비해야 하는 과정을 담은 강의이다. 에이전시의 경우 다양한 시장에 대한 이해가 있어야 프로젝트 수행이 원활하다. 그래서 진행 전 파트너사 및 시장 조사, 상품, 업종 디자인 스타일, 기술 등을 미리 스터디해야 한다는 것을 알게 되었다. 역시나 배경지식과 시장에 대한 이해도가 높아야 프로젝트를 퀄리티를 높일 수 있다. 오른쪽 보이는 것처럼 아주 다양하고 방대한 시장들이 존재한다. 이것들에 대해서 평소에 조금씩 관심을 가지고 관찰을 하면 디자인 작업시 크게 도움이 될 것이라고 생각한다. 프로젝트에 들어가면 파트너사, 시장, 기술에 대해서 조사를 해야한다. 그리고 관련 디자인 스타일도 함께 살펴보아야 하고 사용성과 서비스 구조에 대해서 분석을 해봐야한다. 서비스 구조를.. 공감수 0 댓글수 0 2023. 7. 23.
[PlusX Sharex Fastcampus] UI 업무 프로세스 이번 강의는 플러스엑스가 진행하는 UI 프로세스에 대한 전반적인 틀을 알려주었다. 디자인 이전에 기획은 필수이기에 ui 역시 브랜드에 대한 진단과 방향에 대해 리서치하고 기획하는 단계를 거쳤다. 리서치를 내용을 바탕으로 키워드 중심으로 디자인 컨셉을 도출하고 그에 따른 타이포, 이미지, 서체, 컬러 등 디자인 원칙을 정의한다. 이 과정들은 브랜드를 구축할 때 진행하는 프로세스와 유사해보인다. 그 다음으로 홈, 서브, 상세페이지에 대한 디자인을 진행한다고 한다. 파트너사에게 어떤 디자인 방향으로 진행되는지 보여주는 작업인 것 같다. 그 다음으로 파트너사가 디자인을 더욱 쉽게 이해 할 수 있도록 프로토타입을 제작하여 더욱 명확하게 작업을 진행하는 것 같다. ui은 인터렉션의 요소가 들어가기 때문에 이 단계는.. 공감수 0 댓글수 0 2023. 7. 21.
[PlusX Sharex Fastcampus] 플러스엑스 대표 프로젝트 플러스엑스 대표 프로젝트 CGV 모바일 환경 구축이 점차 시작할 때 쯤 CGV 프로젝트로 새로운 방향을 제시해 모바일 시장에 대응한다는 점에서 인상 깊었다. 이후로 러브콜을 받으며 프로젝트를 진행했다고 하는데 역시 완성도 있는 개척은 파급력이 높은 것 같다. 29CM 29CM가 처음 세상에 공개됐을 때 그동안 보지 못했던 디자인 방식과 컨텐츠 제공에 놀라움을 금치 못했다. 그 바탕에는 브랜드 가치를 중심으로 이미지, 스토리를 시각화하여 컨텐츠를 소비할 수 있도록 한 점을 강의를 통해 다시 한 번 인지하게 되었다. 몇 년이 지났지만 아직도 29cm의 디자인은 전혀 뒤쳐지지 않았고 커머스 산업에 새로운 반향을 불러 일으켰다. 정사각형 플랫폼 안에 유니크한 라인들이 결합하여 29cm만의 브랜드다움을 만들어낸 .. 공감수 0 댓글수 0 2023. 7. 20.
[PlusX Sharex Fastcampus] UX와 UI 플러스엑스 팀 구성 플러스엑스의 팀 구성에 대해 궁금증을 가지고 있었는데 강의를 통해 해소가 되었다. 총 7개의 팀으로 구성이 되어있었다. BX 브랜드 경험 / UX 사용자 경험 / UI 사용자 인터페이스 디자인 / DX 프론트 경험 /CX 사내 사업 담당 /EX 회계, 인사 담당 / AL 브랜드 및 서비스 운영 이렇게 많은 팀들이 존재하기 때문에 고도화 된 결과물이 나왔다고 생각된다. 각각의 프로젝트 성향에 따라 팀별로 협업을 맺고 진행하기 때문에 전문화되고 고차원의 디자인이 산출된 것이라 생각한다. 나도 내가 공부하는 분야에서 다른 팀들과 협업을 원활히 할 수 있도록 준비를 해야겠다. 그러기 위해선 특정 분야 외에 다른 영역의 지식과 정보를 깊게는 모르더라도 소통 할 정도는 가지고 있어야 겠다. 인하.. 공감수 0 댓글수 0 2023. 7. 19.
[PlusX Sharex Fastcampus] UI 디자인에 대하여 강의를 보고 UX, UI에 대해 다시 한 번 생각해 보는 시간을 가졌다. 언제부터 UX, UI가 활용됐는지 그리고 세상에 어떤식으로 적용되는지를 생각해보았다. 아이폰 출시 이전 UX, UI를 경험할 수 있는 것은 컴퓨터 속 인터넷이였다. 이제는 빠른 기술의 발전으로 손바닥만한 작은 기계속에서 많은 것들을 경험 할 수 있다. 특히 라이프스타일, 패션, 취미, 음식, 배달, 등 다양한 서비스를 앱, 웹으로 경험하지 않은 사람은 없을 것이다. 이제는 필요가 아닌 필수가 되어버렸다. 이러한 산업 속에서 UI디자이너는 어떤 관점과 태도로 접근해야 할 까 생각해보았다. 과열된 브랜드와 서비스 현재 서비스들은 과포화 상태라고 생각된다. 이미 세상에 공개 된 서비스지만 또 다른 형태만을 지닌채 기능이 비슷한 서비스를 .. 공감수 0 댓글수 0 2023. 7. 18.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.