개발자의 UI 디자인 기술의 일반적인 부족 극복

나는 많은 개발자들이 UI 디자인에 능숙하지 않다는 것을 알았지 만 (나는 이것이 얼마나 진실인지는 모르겠지만) 적어도 나에 대해서는 사실 이다.

웹 개발에서 좋은 코드 개발 기술로는 UI 디자인 기술이 없으면 충분하지 않습니다.

저와 저와 같은 많은 개발자들에게는 디자이너의 비용을 지불하는 것 이외의 다른 절반을 어떻게 완성해야합니까?

약간만 수정하면 오픈 소스 웹 템플릿을 사용하는 것이 가장 적합한 솔루션입니까, 아니면 다른 옵션이 있습니까?

나는 또한 디자인에 능숙하지 않은 개발자입니다. 디자인을해야하는 프로젝트에서 작업 할 때 가능한 한 단순하게 유지하기 위해 최선을 다합니다. 나는 매우 논리적으로 접근하고 사용자 경험을 위해서만 디자인했습니다. 나는 그것을 정말로 아름답게 보이게 할 수는 없지만, 사용자 친화적이고 눈을 즐겁게 해 줄 수 있습니다.

나는이 책의 여러 읽고 : http://www.uxbydesign.org/2009/06/24/20-user-experience-books-you-should-own/를 하고 그들은 정말 나를 도왔다.

이 목록에서 내가 가장 좋아하는 것을 편집 하지 마십시오.

디자인은 무엇이든 다양한 이해 관계자 (고객, 개발자, 사용자)의 요구 사이의 협상입니다. 자신의 요구를 가장 잘 이해하고 다른 이해 관계자의 요구보다 우선하는 경향이 있기 때문에 일반적으로 최고의 디자인을 만들 수있는 이해 관계자는 없습니다. 훌륭한 디자이너는 다양한 이해 관계자의 요구를 파악할 수 있으며, 이해 관계자가 자신이 알지 못하는 경우가 많을 수도 있습니다.

당신은 아마 이것을 여러 번 보았을 것입니다. 사용자는 일반적으로 이미 익숙한 다른 시스템과 관련하여 시스템과 상호 작용하는 방법에 대해 생각합니다. 개발자는 주로 시스템 작동 방식에 대해 생각합니다. 고객은 일반적으로 모든 문제를 해결할 수있는 방법을 원하거나 가장 저렴한 비용으로 특정 문제를 해결하고자합니다.

훌륭한 디자이너가 되려면 어떻게 구현할 것인지 미리 생각하는 법을 배워야합니다. 대신, 다른 이해 당사자들이 필요로하고 원하는 것에 대해 말하고있는 내용에 집중해야하며, 줄 사이를 읽을 수 있어야합니다. 개발자와 마찬가지로 고객과 사용자는 종종 선험적 인 솔루션을 염두에두고 기본 요구 사항 대신 해당 솔루션을 설명하는 경향이 있습니다. (고객이 원하는 것을 정확히 말해 줄 때 고객이 말하는 것을 의미한다는 것을 인식하는 것이 중요합니다. 확실하지 않은 경우 문의하십시오.)

더 피상적으로, UI의 미학적 디자인은 일부 개발자들이 어려움을 겪고있는 것이기도합니다. 소프트웨어 개발자들은 종종 미학에 대한 교육을 많이받지 못하기 때문에 CS 학생들은 미술 수업 시간이 부족할 수 있다고 생각합니다. 우리가 보이는 것보다 무언가가 어떻게 작동하는지에 더 관심이 있기 때문에 부분적으로 다시 나타납니다. 버튼 모서리의 반경이 9 픽셀인지 또는 10 픽셀인지는 신경 쓰지 않습니다. 이 두 가지 요소는 분명히 관련이 있습니다. 때로는 UI 프레임 워크 형태의 통조림 솔루션을 사용하여이를 극복 할 수 있으며 사전 디자인 된 구성 요소를 사용하면 동일한 시스템의 다른 응용 프로그램과 시각적으로 자신의 작업을 통합 할 수 있다는 이점이 있습니다. 읽고 다른 사람들의 작업을보고 미적 기술을 향상시킬 수 있습니다. 과거에 무시했을 수있는 시각적 세부 사항에주의를 기울입니다. 또한 시각적 차이의 논리를 이해해야합니다. 사각형 모서리 단추는 둥근 단추와 다른 의미입니까? 색상은 어떻게 사용됩니까? 기타

내가 찾은 것들 중 일부는 다음과 같습니다.

• 다른 소프트웨어에서 좋아하거나 싫어하는 것을 기록하십시오. 우리는 프로그래머이며, 우리 삶의 많은 부분을 컴퓨터에서 보냅니다. 소프트웨어를 사용할 때 좋아하거나 싫어하는 것을 적어보십시오. 그것이 컴퓨터 소프트웨어, 비디오 게임, 모바일 장치 등이라면 상관 없습니다. 편리하고 사용하기 쉬운 것과 그렇지 않은 것을 눈여겨보십시오.

• 귀하와 사용자의 UI를 스케치하기위한 사용하기 쉬운 스케치 도구를 찾으십시오. Balsamiq 은 빠르고 간단하며 웹 버전은 무료이므로 사용하는 것을 좋아 합니다.

• 무언가를 디자인하기 위해 소프트웨어 디자인을 전문으로하는 사람을 찾을 필요는 없습니다. 나는 하루 종일 소프트웨어와 관련이 있다는 것을 알고 어떤 것이 좋아 보이거나 사용자에게 친숙하다는 것을 알 수 있기 때문에 프로젝트와 전혀 관련이없는 사람들에 의해 스케치를 자주 실행합니다. 그것들은 종종 무엇을해야하는지에 대한 미친 아이디어를 줄 것이며, 단순히 "멋지다"는 것과 실제로 생산성을 향상시킬 수있는 것을 알아야합니다.

• 자세한 내용 은 /ux// 에 문의하십시오.

솔직히 UI 디자인은 모두 다른 것입니다. 개발자는 항상 미묘한 디자인을 생각하며 디자인에있어 독창적이지 않습니다. 내가 느끼는 확실한 접근 방식은 UI 디자인을 위해 다른 개발자를 유지하는 것입니다. 비용이 추가되지만 더 나은 결과를 얻는 데 도움이 될 것입니다.

두 가지 일을 모두하는 사람에게는 절대로 최고의 결과를 제공하지 않습니다. 따라서 IMHO는이 두 가지 측면을 두 명의 다른 개발자에게 할당해야합니다. CMS가 다른 경우 스키닝 및 테마 개발을위한 HTML 및 CSS에 대한 약간의 지식이 권장되지만 완전히 새로운 디자인을 개발해야하는 경우 UI 디자이너에게 문의하십시오.

Joel Spolsky의 저서 User Interface Design for Programmers를 확실히 추천 할 수 있습니다 . 이 책에서 그는 여러분이 찾고있는 접근 방식을 거의 취합니다. UI 디자인이 프로그래머에게 중요한 이유를 설명합니다. 일부 온라인 관련 자료 :

삶과 더 좋은 일을하는 사람들을위한 디자인

UI 디자인은 많은 사람들에게 자연스럽지 않습니다. 그러나 최근 몇 가지 쉬운 원칙을 따르면서 훨씬 나아졌습니다.

1. 놀라지 마십시오. 생각만큼 어렵지는 않습니다.

2. 먼저 데이터 구조와 엔진을 모델링하십시오. 명확하고 실제 대응하는 모델을 만듭니다. 분명히 이것은 고객이 원하는 것을 이해하는 데 시간이 걸렸다 고 가정합니다.

3. 이제 한 장의 종이와 연필로 앉아서 화면의 논리적 레이아웃을 그리기 시작하십시오. 이것은 일반적으로 데이터 모델을 체계적으로 사용자에게 제시합니다. 목표는 간단해야합니다.

   ㅏ. 앱이 배포 될 환경을 모방합니다. 예를 들어, Windows 앱인 경우 Windows 앱처럼 동작해야하며 웹 앱인 경우 사용자보다 인기있는 유사한 웹 응용 프로그램처럼 동작해야합니다.

   비. 목표는 사용자가 예측할 수있는 방식으로 사용자에게 데이터 모델을 안내하는 것입니다. 사용자 인터페이스는 사용자가 응용 프로그램에서 무언가를 수행 할 때 잘 설계되었으며 사용자가 예상 한대로 정확하게 수행합니다.

   씨. 시간이 걸리고 학습 곡선이지만 누구나 할 수 있습니다.

4. 그래픽, 즉 버튼, 배경 등을 걱정하지 마십시오.이 시점의 유일한 목표는 페이지의 논리적 레이아웃입니다.

5. html, gtk, cocoa, android, Windows.Forms 등 이벤트 처리 메커니즘, 레이아웃 엔진을 이해하고 입력 및 표시 검색 등을 사용하는 GUI 라이브러리를 마스터해야합니다. 데이터. 모든 개발자는 최소한이 작업을 수행 할 수 있어야합니다.

6. 여기에서 그래픽 디자이너를 인계받는 것은 부끄러운 일이 아닙니다. 그러나 최소한 5 단계를 지나칠 수 있어야합니다. 이는 전체 앱의 작업량의 95 %입니다.

여기 저를 가난한 GUI 디자이너에서 훨씬 더 나은 GUI 디자이너로 바꾸는 유용한 기사가 있습니다.

http://www.joelonsoftware.com/uibook/fog0000000249.html

레이아웃, 그래픽 및 디자인에 대한 아이디어를 얻기 위해 "유사한"사이트의 성공적인 예를 찾을 수도 있습니다. 좋아하는 페인트 프로그램을 약간 조정하면 많은 아이디어를 빌려서 나만의 것으로 만들 수 있습니다. 똑바로 복사하지 마십시오. 나쁜 태도 일뿐만 아니라 대부분의 경우 불법 일 수도 있습니다.

몇 번 빌린 후에는 성공적인 사이트의 디자인에 대해 더 나은 느낌을 갖기 시작할 것입니다.

HTML이 도입됨에 따라 추악하지 않은 단순한 사이트를 만드는 것이 어려워졌습니다. 당신이 개념을 가지고 있을지 모르지만, 그것을 제대로 이해하려면 몇 가지 트릭, 도구, 준비된 그래픽 및 CSS 지식이 필요합니다. 또한 선명하게 보이는 페이지를 생성하려면 디자인 프로세스에 영향을 미치는 사용성 기술 및 기타 인적 요소가 필요합니다.

개발자는 복잡한 언어, OOP, ORM, SQL, T-SQL 등을 배우는 데 많은 시간을 할애합니다. 또한 웹 사이트를 만들기위한 도구에는 거의 투자하지 않습니다 (대부분 비싸다).

그 결과 많은 개발자들이 멋진 웹 페이지를 만들지 못하는 데 어려움을 겪습니다. 필요한 도구를 배우면 좋은 페이지도 만들 수 있다고 생각합니다.

응용 프로그램 개발 프로세스에서 롤이 무엇인지 아는 것도 중요합니다. 웹 디자인은 필수 기술이 아닌 기술을 보유하는 것이 좋습니다. 대규모 프로젝트에서는 위에서 언급 한 이유로 인해 프로그래머 작업이되어서는 안됩니다.

이 도구가 훌륭한 도구라는 것을 알았습니다.

아티스트

그것을보고 데모를 시도하십시오. 정말 좋습니다.

여전히 웹 개발에서 훌륭한 개발 기술로는 디자인에 큰 기술이 없으면 충분하지 않습니다.

이 진술이 사실인지 모르겠습니다. 나는 그것이 당신이 일하는 곳에 달려 있다고 생각합니다.

예를 들어 소규모 회사 일수록 스킬 셋에 대한 유연성이 높아야하지만 대기업의 경우 같은 기대치가 아닐 수 있으며 디자인 팀이 설계 작업을하는 동안 실제로 개발하는 데 시간을 할애 할 수 있습니다.

Microsoft는 실제로 개발자와 디자이너 사이의 명확한 분리를 강조하기 위해 도구 세트를 업데이트했습니다. 그들은 WPF와 함께 Expression Blend를 도입했습니다. 이제 개발자가 소프트웨어의 기능을 작업하고 다른 사람이이를 위해 디자인을 수행 할 수 있습니다. 그들은 서로 다른 도구를 사용하며 동시에 프로젝트에서 작업 할 수 있지만 기능과 디자인을 수행 할 수 있습니다.

개발자는 데이터 포인트를 지정하고 디자이너가이를 표시합니다.

코드뿐만 아니라 디자인도 테스트 할 수 있습니다. 간단하게 시작하고, 소수의 사람들에게 디자인을 시도하고, 피드백을 기록한 다음 거기서 나가십시오. 이를 통해 디자인 문제를 식별하고 다른 방법으로 수행 할 수있는 작업에 대한 아이디어를 얻을 수 있습니다. 그런 다음 디자인을 수정하고 반복하십시오.

당신은 그것을 위조하고 다른 디자인을 복사해야합니다. 사용자에게 큰 이익이 될 하나 또는 두 가지 기능을 제외하고는 멋진 것을 피하십시오. 글꼴, 색상 및 혼란을 제한하는 몇 가지 기본 방법을 따르십시오.

UI.stackexchange.com에 질문을 올리는 것을 두려워하지 마십시오.

전문 분야가 아니지만 UI를 만드는 방법을 연구하는 것이 항상 흥미 롭습니다. 요즘 대부분의 웹 페이지는 매우 역동적이며 일부 UI 기술을 아는 것은 구성 요소를 만들고 페이지 요소와의 상호 작용을 설정할 때 확실히 도움이 될 것입니다. 나는 백엔드 전용 개발 배경에서 왔으며 인터페이스를 만들 때 얼마나 많은 관련이 있는지에 놀랐습니다.

웹 디자인에 대해 읽은 특히 좋은 책이 있으며 개발자를 대상으로합니다.

개발자를위한 웹 디자인 : http://pragprog.com/book/bhgwad/web-design-for-developers

인터페이스를 만들 때 일반 스케치 및 프로토 타입 UI에서 HTML + CSS를 사용한 디자인 제작에 이르기까지 모든 단계를 다루는 책을 쉽게 읽을 수 있습니다.

UI 기술을 더욱 향상시키기 위해 Ryan Singer와 함께 PeepCode의 최신 스크린 캐스트를 추천합니다. http://peepcode.com/products/ryan-singer-ux

나는 UX / UI / graphics / typography의 기본을 고르는 것이 확실히 소중한 노력이라고 생각합니다. 물론 "다재다능한"전문가들로 구성된 팀을 항상 가질 수는 없습니다. 많은 사람들은 여러 개의 모자를 착용해야합니다. 좋은 개발자는 자신의 영역 밖의 것들에 대해 배우는 데 시간을 투자하는 데 가치가 있으며 최소한 디자인에서 좋은 일을 인식 할 수 있어야합니다.

그러나 디자이너가하는 일에 대해 할 말이 있습니다. 개발자는 디자인 영역 (다른 것보다 더 많은 것)에서만 그렇게 많은 것을 할 수 있습니다. 특히 좁은 틈새 시장을 넘어서는 대규모 공공 프로젝트는 실제 디자인 전문가를 고용함으로써 큰 ​​이점을 얻습니다. 그리고 단순히 CSS와 HTML 색상 코드 주위를 스윙 할 수있는 사람들을 의미하지는 않습니다. 조셉 알버 (Josef Alber)의 컬러에 관한 책을 읽고 이해 했으며 신문에 무너져 나오는 숯으로 아름다운 스케치를 만들 수있는 타이포그래피와 같은 것들을 연구하는 데 몇 년을 소비 한 사람들을 의미 합니다. 이것들은 귀중한 기술이며이를 인정하는 프로젝트이며 이러한 기술을 집중적으로 사용할 수 있도록하는 것은 경쟁에서 결정적인 우위를 차지합니다.

즉, 디자이너와 개발자가 자신의 기술을 겹칠 수있는 영역이 있습니다. 특히 UX 및 해당 하위 도메인 UI. 나는 추천합니다 ...

• 상호 작용을위한 설계
• 인터페이스 디자인
• 인터랙션 디자인

전문가를 고용하십시오.

사실 개발자의 UI는 끔찍한 명성을 가지고 있습니다. 개발자가 설계의 평균보다 낮기 때문이 아니라 개발자의 도움을 요청하는 평균보다 낮기 때문입니다.

개발자는 모든 디지털 과제를 해결하려는 경향이 있습니다.

(저는 10 년 동안 전문 개발자였으며 ​​제 아내는 20 년 동안 사용자 인터페이스 디자이너입니다)