A Good User Interface

UI 관련 해외사이트에 좋은 정보가 있어서 포스팅합니다.
구글번역기를 통해서 번역했기 때문에 오역이 상당하지만..뭐 보는데 큰 무리가 없다고 생각됩니다.

A Good User Interface

has high conversion rates and is easy to use. In other words, it's nice to both the business side as well as the people using it. Here is a running list of practical ideas to try out.

뛰어난 사용자 인터페이스

높은 전환율을 가지고있어 사용하기 쉽습니다. 즉, 그것을 사용하여 비즈니스 측면뿐만 아니라, 사람에 모두 좋습니다. 여기에 시도위한 실용적인 아이디어를 실행하는 목록입니다.

Idea 1

Try A One Column Layout instead of multicolumns.

 A one column layout will give you more control over your narrative. It should be able to guide your readers in a more predictable way from top to bottom. Whereas a multi column approach runs some additional risk of being distracting to the core purpose of a page. Guide people with a story and a prominent call to action at the end.

멀티커뮤니케이션 대신 일렬 배치를 시도하십시오.

1 열 레이아웃은 당신의 이야기를보다 효율적으로 관리를 해준다. 그것은 위에서 아래로 더 예측 가능한 방식으로 독자를 이끌 수있는 것이다. 다중 열 방식은 페이지의 핵심 목적에 일부 혼란을 주고 추가적인 위험을 감수하게 되며. 이야기의 끝으로 사용자들을 안내하게 된다.

Idea 2

Try Giving a Gift instead of closing a sale right away.

A friendly gesture such as providing a customer with a gift can be just that. Deeper underneath however, gifting is also an effective persuasion tactic that is based on the rule of reciprocity. As obvious as it sounds, being nice to someone by offering a small token of appreciation can come back in your favour down the road.

즉시 판매를 하기 전에 선물을 주십시오.

선물은 단지 고객에게 제공하는 상냥한 몸짓이라고 볼 수 있습니다. 그러나 아래에 깊이 증여도 상호주의의 규칙에 따라 효과적인 설득 ​​전술입니다. 그것은 소리로 알 수 있듯이, 감사의 작은 토큰을 제공함으로써 누군가에게 친절하다는 것은 길을 당신 덕분에 돌아올 수 있습니다.

Idea 3

Try Merging Similar Functions instead of fragmenting the UI.

Over the course of time, it's easy to unintentionally create multiple sections, elements and features which all perform the same function. It's basic entropy - things start falling apart over time. Keep an eye out for duplicate functionality labelled in various ways, as it puts a strain on your customers. Often, the more UI fragmentation there is, the higher the learning curve which your customers will have to deal with. Consider refactoring your UI once in a while by merging similar functions together.

대신 UI를 조각 유사한 기능을 병합하여보십시오.

시간이 지남에 따라 그것이 의도하지 않고 여러 섹션의 모든 요소와 동일한 기능을 수행하는 기능을 쉽게 만들 수 있습니다. 그것은 엔트로피 기본이다 - 상황이 시간이 지남에 뿔뿔이 흩어 시작. 그것은 당신의 고객에게 부담을 강요 등 다양한 방법으로 표시된 중복 기능들을 경계해야합니다. 종종 거기에 많은 UI 조각화가 높은 고객이 대처해야한다 학습 곡선. 함께 유사한 기능을 병합하여 가끔 리팩토링에 당신의 UI를 생각해 봅시다.

Idea 4

Try Social Proof instead of talking about yourself.

Social proof is another great persuasion tactic directly applicable to increasing conversion rates. Seeing that others are endorsing you and talking about your offering, can be a great way to reinforce a call to action. Try a testimonial or showing data which proves that others are present.

대신 자신의 이야기의 사회적 증명을보십시오.

사회적 증거가 증가하고 전환율에 직접 적용되는 다른 위대한 설득 전술입니다. 다른 사람이 당신을지지하고 당신의 제안에 대해 이야기하고있는 것을 보는 것은 행동에 대한 호출을 강화하는 좋은 방법이 될 수 있습니다. 다른 사람이 존재하는 것을 증명하고 표창장 또는 나타내는 데이터를 사용해보십시오.

Idea 5

Try Repeating Your Primary Action instead of showing it just once.

Repeating your call to action is a strategy that is more applicable to longer pages, or repeating across numerous pages. Surely you don't want to have your offer displayed 10 times all on the same screen and frustrate people. However, long pages are becoming the norm and the idea of squeezing everything "above the fold" is fading. It doesn't hurt to have one soft actionable item at the top, and another prominent one at the bottom. When people reach the bottom, they pause and think what to do next - a potential solid place to make an offer or close a deal.

한 번만 그것을 나타내는 것이 아니라, 당신의 1 차 작업을 반복 해보세요.

액션에 대한 호출을 반복하면 더 이상 페이지에 적용하거나 여러 페이지에 걸쳐 반복하는 전략입니다. 확실히 당신의 제안이 모두 동일한 화면에 10 번 표시된있어 사람들을 실망시키고 싶지 않다. 그러나 긴 페이지는 규범 "주름에"모두 짜내라는 생각에지고있는 것은 퇴색입니다. 그것은 1 위 연약한 실용 아이템, 그리고 하단에 다른 저명한을 가지고있어 손해는 없습니다. 사람들은 거기에 도달 할 때, 그들은 일시 정지 다음 무엇을 해야할지 생각 - 제안을하거나 계약을 닫기위한 잠재적 인 단단한 장소.

Idea 6

Try Distinct Styles Between Clickable And Selected Items instead of blurring them.

 Visual styling such as color, depth, and contrast may be used as a reliable cue to help people understand the fundamental language of navigating your interface: where am I, and where can I go. In order to communicate this clearly to your users, the styles of your clickable actions (links, buttons), selected elements (chosen items), and plain text should be clearly distinct from one another and then applied consistently across an interface. In the visual example, I've chosen a blue color to suggest anything that can be clicked on, and black as anything that has been selected or indicates where someone is. When applied properly, people will more easily learn and use these cues to navigate your interface. Don't make it harder for people by blurring these three functional styles.

대신 그들을 흐리게하는 클릭 가능한 그리고 선택한 항목 사이에 명확한 스타일을 시도하십시오.

같은 색상, 깊이, 명암 등의 Visual 스타일링은 사람들이 당신의 인터페이스를 탐색하는 기본 언어를 이해하기위한 안정적인 큐으로 사용할 수있다 : 여기는 어디, 어디, 난 갈 수 있습니다. 사용자에게 명확하게 이것을 전달하기 위해 당신의 클릭 가능한 작업 (링크, 버튼) 선택된 요소 (선택 항목) 일반 텍스트 스타일은 서로 명확하게 구별하여 인터페이스 전체에 일관되게 적용 해야합니다. 시각적 예제에서는 클릭 할 수 있습니다 아무거나 선택하거나 누군가가 어디에 있는지를 보여주는 것으로 검정을 시사하는 파란색을 선택했습니다. 제대로 적용되면, 사람들은 더 쉽게 배우고 당신의 인터페이스를 탐색하기 위해 이러한 단서를 사용합니다. 이 3 개의 기능적인 스타일을 흐리게하여 사람들을 위해 더 힘들어하지 마십시오.

Idea 7

Try Recommending instead of showing equal choices.

When showing multiple offers, then an emphasized product suggestion might be a good idea as some people need a little nudge. I believe there are some psychology studies out there which suggest that the more choice there is, then the lower the chances of a decision actually being made and acted upon. In order to combat such analysis paralysis, try emphasizing and highlighting certain options above others.

추천 대신 상응하는 대안을 보여보세요.

어떤 사람들은 조금 찔러 필요로하는 여러 제안을 언급 할 때에는 다음 강조 제품의 제안은 좋은 아이디어일지도 모릅니다. 나는 거기에 많은 선택이 있다는 것을 시사하고있다 거기에 몇 가지 심리학 연구가 있다고 믿고, 그 아래의 의사 결정의 가능성은 실제로는 위에 만들어져있어, 행동하고있다. 이러한 분석 마비에 대항하기 위해서는 타인 위의 특정 옵션을 강조하고 강조하여보십시오.

Idea 8

Try Undos instead of prompting for confirmation.

Imagine that you just pressed an action button or link. Undos respect the initial human intent by allowing the action to happen smoothly first and foremost. Prompts on the other hand suggest to the user that he or she does not know what they are doing by questioning their intent at all times. I would assume that most of the time human actions are intended and only in small situations are they accidental. The inefficiency and ugliness of prompts is visible when users have to perform actions repeatedly and are prompted numerously over and over - a dehumanizing experience. Consider making your users feel more in control by enabling the ability to undo actions and not asking for confirmation where possible.

대신 메시지를 표시 실행 취소를보십시오.

그냥 액션 버튼이나 링크를 누른 것을 상상해보십시오. 실행 취소 작업이 무엇보다도 원활하게 일어나게함으로써 초기 인간의 의도를 존중합니다. 한편 프롬프트 그 또는 그녀는 그들은 항상 자신의 의사를 묻는 것으로 무엇을하고 있는지 모른다는 것을 사용자에게 제안. 난 시간이 인간 행동의 대부분이 대상으로하고, 경미한 상황에서 그들은 우연히되어 있다고 가정하고 있습니다. 비인간적 인 경험 - 사용자가 여러 번 작업을 수행해야한다 정도에 위의 메시지가 표시되고 오버 할 때 프롬프트의 비효율과 추함이 보이게됩니다. 작업을 취소하면 가능하면 확인을 요구하지 않는 능력을 가능하게하여 사용자가 컨트롤을 많이 느끼는 것을 고려하십시오.

Idea 9

Try Telling Who It's For instead of targeting everyone.

Are you targeting everyone or are you precise with your audience? This is a conversion idea where you could be explicit about who exactly your product or service is intended for. By communicating the qualifying criteria of your customers, you might be able to actually connect more with them while at the same time hinting at a feeling of exclusivity. The risk with this strategy of course is that you might be cutting yourself short and restricting potential customers. Then again, transparency builds trust. 

(Side note: Enjoying the little characters style? Please be sure to check out MicroPersonas.)

그것은 대신에 누구를 대상 때문이다 누구 운세하여보십시오.

당신은 누구를 대상으로하거나 청중과 정확하지 않습니다하고 있습니까? 이것은 누가 정확하게 귀하의 제품이나 서비스를 대상으로하고 관하여 명시 할 수 변환의 생각입니다. 고객의 자격 기준을 통신하여 당신은 동시에 독점적 가치를 제안하면서 실제로는 그들에게 많은 연결 수 있을지도 모릅니다. 물론이 전략과 위험은 자신이 짧아 절단하고 잠재 고객을 제한 할 수 있다는 것입니다. 그럼 다시, 투명성이 신뢰를 구축합니다.

(사이드 노트 :? 조금 문자 스타일을 즐길 MicroPersonas을 체크 아웃하도록하십시오.)

Idea 10

Try Being Direct instead of indecisive.

You can send your message with uncertainty trembling in your voice, or you can say it with confidence. If you're ending your messaging with question marks, using terms such as "perhaps", "maybe", "interested?" and "want to?", then most likely you have some opportunity to be a bit more authoritative. Who knows, maybe there is a bit more room for telling people what to do next in the world of conversion optimization.

직접이 아니라 우유부단 한 때문에 시도하십시오.

당신은 불확실성은 당신의 목소리로 떨리고 당신의 메시지를 보낼 수 있습니다, ​​또는 당신은 그것을 자신있게 말할 수 있습니다. 당신은 "어쩌면", "관심이 있습니까?"이 같은 "아마"라는 용어를 사용하여 물음표로 메시징을 종료하는 경우와 "시겠습니까?"다음 가장 가능성 높은 당신은 조금 더 신뢰성이있는 것처럼 몇 가지 기회가 있습니다. 누가 아마 변환 최적화의 세계에서 다음에 무엇을 해야할지 사람들에게 전하기 위해 좀 더 여지가있다, 알고있다.

Idea 11

Try More Contrast instead of similarity.

 Making your calls to action be a bit more prominent and distinguishable in relation to the elements surrounding them, will make your UI stronger. You can easily increase the contrast of your primary calls to action in a number of ways. Using tone, you can make certain elements appear darker vs. lighter. With depth, you can make an item appear closer while the rest of the content looks like it's further (talking drop shadows and gradients here). Finally, you can also pick complementary colors from the color wheel (ex: yellow and violet) to raise contrast even further. Taken together, a higher contrast between your call to action and the rest of the page should be considered.

대신 비슷한 더 대비를 보시기 바랍니다.

액션에 대한 호출을 할 좀 더 눈에 띄는와 그것을 둘러싼 요소와의 관계에서 구별 가능 당신의 UI가 더 강해집니다. 당신은 쉽게 몇 가지 방법으로 작업에 기본 통화 대비를 향상시킬 수 있습니다. 톤을 사용하여 특정 요소가 어두워 대 밝게 보이게 수 있습니다. 깊이가 있다면, 그것은 또한 다 같은 내용의 나머지 부분 (여기에서는 그림자와 그라데이션 화)에 보이면서 항목이 가까워 보일 수 있습니다. 마지막으로, 당신은 또한 컬러 휠에서 보색을 선택 (예 : 노란색과 보라색) 수 더 대비를 올린다. 함께되고, 당신의 행동에 대한 호출 페이지의 나머지 부분 간의 높은 대비를 고려해야한다.

Idea 12

Try Showing Where It's Made instead of being generic.

Indicating where you, your product or service is from says quite a bit subliminally while at the same time moves your communication to a more personal level. Mentioning the country, state or city of origin is surely a very human like way to introduce oneself. If you can do the same virtually then you just might be perceived as a bit more friendly. Often, stating where your product is being made at also has a pretty good chance of making it feel of slightly higher quality. It's a win win.

그것은 대신 범용 것으로 만들어져있는 위치를 표시하여보십시오.

당신 어디를 보여주고 당신의 제품이나 서비스가 동시에 더 개인적인 수준에 당신의 커뮤니케이션을 이동하면서 꽤 비트가 무의식 말 때문입니다. 국가를 언급하고 기원 상태 및 도시 확실하게 자신을 소개하는 매우 인간과 같은 방법입니다. 당신은 사실상 다음 같은 일을 할 수 있다면 좀 더 친절로 인식 될 수 있습니다. 종종 당신의 제품은 또한에서 행해지고있는 위치를 알리는 것은 그것이 약간 더 높은 품질을 느낄 수있는 아주 좋은 기회가있다. 그것은 승리의 승리이다.

Idea 13

Try Fewer Form Fields instead of asking for too many.

 Human beings are inherently resistant to labor intensive tasks and this same idea also applies to filling out form fields. Each field you ask for runs the risk of making your visitors turn around and give up. Not everyone types at the same speed, while typing on mobile devices is still a chore in general. Question if each field is really necessary and remove as many fields as possible. If you really have numerous optional fields, then also consider moving them after form submission on a separate page or state. It's so easy to bloat up your forms, yet fewer fields will convert better.

너무 많이 요구하는 것이 아니라 적은 양식 필드를 시도하십시오.

인간은 노동 집약적 인 작업에 근본적으로 방지하고 이와 같은 생각은 양식 필드에 필요 사항을 기입에 적용됩니다. 당신이 원하는 각 필드에는 당신의 방문자가 뒤돌아과 포기의 위험을 실행합니다. 같은 속도로 아무도 유형, 모바일 장치에서 입력하는 동안은 아직 일반적으로 잡일입니다. 질문 필드가 정말 필요하고 가능한 한 많은 필드로 삭제 한 경우. 정말 많은 옵션 필드를 가지고 있다면, 그 후에도 다른 페이지 또는 상태 양식을 제출 한 후 그들을 이동하는 것이 좋습니다. 그것은 당신의 양식을 부풀려 때문에 쉽게 아직 덜 필드는 더 나은 변환됩니다.

Idea 14

Try Exposing Options instead of hiding them.

 Each pull down menu that you use, hides a set of actions within which require effort to be discovered. If those hidden options are central along the path to getting things done by your visitors, then you might wish to consider surfacing them a bit more up front. Try to reserve pull down menus for options that are predictable and don’t require new learning as in sets of date and time references (ex: calendars) or geographic sets. Occasionally pull down menu items can also work for those interfaces that are highly recurring in terms of use - actions that a person will use repeatedly over time (ex: action menus). Becareful of using drop downs for primary items that are on your path to conversion. 

대신 그들을 숨기기 옵션을 공개하려고합니다.

각각은 당신이 사용하고있는 풀다운 메뉴를 발견하는 노력을 필요로하는 안에 일련의 작업을 숨 깁니다. 그 숨겨진 옵션은 상황이 당신의 방문자가 끝나지 경로를 따라 중앙에 있다면, 그들을 더 올라간다 최근 부상 고려해 볼 수 없습니다. (: 달력 EX) 또는 지리 세트 예비가 예측 가능하며, 날짜 및 시간 참조 집합처럼, 새로운 학습을 필요로하지 않는 옵션 메뉴를 풀다운하여보십시오. 사람은 (: 작업 메뉴 예) 시간이 지남에 반복 사용하는 액션 - 때때로 풀다운 메뉴 항목은 고도 이용의 관점에서 재발되는 이러한 인터페이스를 위해 일할 수 있습니다. 전환 경로에있는 주요 품목에 드롭 다운을 사용하여 직전.

Idea 15

Try Suggesting Continuity instead of false bottoms.

A false bottom is a conversion killer. Yes, scrolling long pages are great, but be careful of giving your visitors a sense that the page has come to an end somewhere in between sections where it really hasn't. If your pages will scroll, try to establish a visual pattern or rhythm that the user can learn and rely on to read further down. Secondarily, be careful of big gaps in around the areas of where the fold can appear (of course I’m referring to a area range here with so many device sizes out there).

대신 가짜 바지의 제안 계속해서보십시오.

밑바닥은 변환 살인자입니다. 네, 스크롤 긴 페이지가 좋지만 방문자의 페이지가 어딘가에 정말 없어 섹션 사이에 끝날 때가 있다는 느낌을주는 것에주의하십시오. 당신의 페이지가 스크롤 된 경우 시각적 패턴 또는 사용자가 학습하고 더 아래로 읽기에 의지 할 수있는 리듬을 확립하자. 둘째, 주름이 나타날 수 있습니다 어디에 분야 (물론 거기에 너무 많은 장치 크기와 함께 여기에 위치 범위를 추천하고있다) 주위에 큰 격차주의 하십시오.

Idea 16

Try Keeping Focus instead of drowning with links.

It’s easy to create a page with lots of links going left and right in the hope of meeting as many customer needs as possible. If however you’re creating a narrative page which is building on towards a specific call to action at the bottom, then think twice. Be aware that any link above the primary CTA runs the risk of taking your customers away from what you’ve been hoping them to do. Keep an eye out on the number of links on your pages and possibly balance discovery style pages (a bit heavier on the links) with tunnel style pages (with less links and higher conversions). Removing extraneous links can be a sure way to increase someone’s chances of reaching that important button.

초점을 유지하는 대신 링크에 빠져보십시오.

그것은 많은 고객이 최대한 필요로 회의 것인지 좌우로 이동 링크가 많은 페이지를 작성하는 것은 간단합니다. 하지만 당신이 맨 아래에있는 특정 행위에 호출 방법에에 구축하는 이야기 페이지를 작성하는 경우는 2 번이라고 생각합니다. 기본 CTA 위의 링크는 당신이 그들을 만들 것을 희망하고 있던 것들로부터 떨어져 당신의 고객을 취할를 위험에 유의하십시오. 당신의 페이지에 연결의 수에 눈을 뗄 수없는 아마 발견 스타일의 페이지 (링크에 조금 무거운) 터널 스타일의 페이지합니다 (아래 링크와 높은 변환 포함) 균형. 무관 한 링크를 제거하면 중요한 버튼에 도달 누군가의 가능성을 높이기위한 확실한 방법이 있습니다.