From Design pattern
Jump to: navigation, search
(Select area (Control pointers))
 
(8 intermediate revisions by one user not shown)
Line 1: Line 1:
{{#css:
 
#mw-content-text h3 span {
 
font-weight: 600;
 
padding-left: 0px;
 
}
 
 
.mw-headline {
 
font-weight: 600;
 
}
 
 
span.mw-editsection {
 
font-weight: 200;
 
position: relative;
 
float:right;
 
margin-right: 25px
 
}
 
 
span.mw-editsection a {
 
font-weight: 200;
 
}
 
 
.art-subpage {
 
background: #F7F7F7;
 
}
 
 
#mw-content-text p {
 
padding-top: 0px;
 
padding-bottom: 6px;
 
}
 
 
.mw-content-ltr ul {
 
margin: 0.3em 0 0 42px;
 
}
 
 
 
hr {
 
margin-top: 0px;
 
margin-bottom: 0px;
 
margin-left: -31px;
 
width: 720px;
 
border-bottom: 1px solid #E0E0DD;
 
border-left: 0px;
 
border-right: 0px;
 
border-top: 30px solid #F7F7F7;
 
}
 
<!--
 
#sun-col {
 
-webkit-column-count:2; /* Chrome, Safari, Opera */
 
-moz-column-count:2; /* Firefox */
 
column-count:2;
 
}
 
 
#sun-col p {
 
padding-left: 0px;
 
 
}
 
-->
 
 
.thumb {
 
margin: 0px 25px 5px 25px;
 
}
 
 
}}
 
 
 
Select area는 사진이나 이미지를 편집하기 위해 영역을 선택하기 위한 패턴이다. 주로 편집 화면에서 영역선택 툴을 활성화환 상태에서 활용 가능하다.
 
Select area는 사진이나 이미지를 편집하기 위해 영역을 선택하기 위한 패턴이다. 주로 편집 화면에서 영역선택 툴을 활성화환 상태에서 활용 가능하다.
  
용도나 활용성에 따라 선택할 수 있는 방법은 다양하나, Rectangular marquee tool 방식과 이미 활성화된 영역이 있는 상태에서 활성화된 영역에 대한 control pointer를 조절하는 방식이 주로 사용된다.
+
용도나 활용성에 따라 선택할 수 있는 방법은 다양하다. 한 지점에서 다른 지점으로 drag하여 두 점이 이루는 직선을 대각선으로 하는 직사각형의 영역을 선택하는 rectangular marquee tool 방식과 닫힌 도형을 자유롭게 그려 특정 영역을 선택하는 lasso tool 방식, 이미 활성화된 영역이 있는 상태에서 활성화된 영역에 대한 control pointer를 조절하는 방식이 사용된다.
  
 
=== With this pattern, we can solve... ===
 
=== With this pattern, we can solve... ===
* Select area를 구현하지 않은 상태에서는 사진이나 이미지를 편집할 때, 각각의 이미지 전체를 일괄적으로 편집하게 된다. 전문 사진 편집 어플리케이션이나 메모 어플리케이션 등에서 사진이나 이미지의 부분만을 편집하거나 부분으로 저장하기 위해서 영역을 선택하는 기능이 필요해졌다.  
+
Select area를 구현하지 않은 상태에서는 사진이나 이미지를 편집할 때, 각각의 이미지 전체를 일괄적으로 편집하게 된다. 전문 사진 편집 어플리케이션이나 메모 어플리케이션 등에서 사진이나 이미지의 부분만을 편집하거나 부분으로 저장하기 위해서 영역을 선택하는 기능이 필요해졌다.  
  
* Select area는 지정된 비율이나 사이즈로 사진이나 이미지를 업로드하는 기능을 가진 어플리케이션에서 프로그램이 임의로 사진의 일부를 보여주는 방식이 아니라, 사용자가 원하는 부분을 보여주기 위해 활용된다.  
+
* Select area는 사용자가 원하는 부분을 보여주기 위해 활용된다.
 +
* 지정된 비율이나 사이즈로 사진이나 이미지를 업로드하는 기능을 가진 어플리케이션에서 프로그램이 임의로 사진의 일부를 활용하는 과정은 [[Object zoom in/out]]에 속한다.
 +
* Select area는 편집이나 선택된 영역만 남기고 자르기 등의 기능으로 이어진다.
 +
 
 +
=== Example : iOS_PopAGraph ===
 +
[[File:Select area.jpeg]]
 +
 
----
 
----
  
== Rectangular Marquee Tool ==
+
== Select area (Rectangular marquee tool) ==
<div id="sun-col">
+
 
한 지점에서 다른 지점으로 drag하여 두 점이 이루는 직선을 대각선으로 하는 직사각형의 영역을 선택한다.
+
 
=== iOS_UPAD ===
 
=== iOS_UPAD ===
 
{{#Widget:Vimeo|id=93374684|width=300|height=405}}
 
{{#Widget:Vimeo|id=93374684|width=300|height=405}}
</div>
 
  
 
----
 
----
== Lasso Tool ==
+
== Select area (Lasso tool) ==
<div id="sun-col">
+
 
닫힌 도형을 자유롭게 그려 특정 영역을 선택한다.
+
 
=== iOS_UPAD ===
 
=== iOS_UPAD ===
 
{{#Widget:Vimeo|id=93374685|width=300|height=405}}
 
{{#Widget:Vimeo|id=93374685|width=300|height=405}}
Line 89: Line 28:
 
=== iOS_PopAGraph ===
 
=== iOS_PopAGraph ===
 
{{#Widget:Vimeo|id=94743505|width=300|height=533}}
 
{{#Widget:Vimeo|id=94743505|width=300|height=533}}
</div>
+
 
 
----
 
----
==Control Pointers==
+
==Select area (Control pointers) ==
<div id="sun-col">
+
 
 
=== iOS_Picsplay ===
 
=== iOS_Picsplay ===
 
{{#Widget:Vimeo|id=96224801|width=300|height=405}}
 
{{#Widget:Vimeo|id=96224801|width=300|height=405}}
Line 98: Line 37:
 
=== iOS_Adobe Photoshop Express ===
 
=== iOS_Adobe Photoshop Express ===
 
{{#Widget:Vimeo|id=96224802|width=300|height=405}}
 
{{#Widget:Vimeo|id=96224802|width=300|height=405}}
</div>
+
 
 +
=== iOS_Genius Scan ===
 +
{{#Widget:Vimeo|id=103218182|width=395|height=524}}
  
 
[[Category:Edit object]]
 
[[Category:Edit object]]

Latest revision as of 18:04, 12 August 2014

Select area는 사진이나 이미지를 편집하기 위해 영역을 선택하기 위한 패턴이다. 주로 편집 화면에서 영역선택 툴을 활성화환 상태에서 활용 가능하다.

용도나 활용성에 따라 선택할 수 있는 방법은 다양하다. 한 지점에서 다른 지점으로 drag하여 두 점이 이루는 직선을 대각선으로 하는 직사각형의 영역을 선택하는 rectangular marquee tool 방식과 닫힌 도형을 자유롭게 그려 특정 영역을 선택하는 lasso tool 방식, 이미 활성화된 영역이 있는 상태에서 활성화된 영역에 대한 control pointer를 조절하는 방식이 사용된다.

With this pattern, we can solve...

Select area를 구현하지 않은 상태에서는 사진이나 이미지를 편집할 때, 각각의 이미지 전체를 일괄적으로 편집하게 된다. 전문 사진 편집 어플리케이션이나 메모 어플리케이션 등에서 사진이나 이미지의 부분만을 편집하거나 부분으로 저장하기 위해서 영역을 선택하는 기능이 필요해졌다.

  • Select area는 사용자가 원하는 부분을 보여주기 위해 활용된다.
  • 지정된 비율이나 사이즈로 사진이나 이미지를 업로드하는 기능을 가진 어플리케이션에서 프로그램이 임의로 사진의 일부를 활용하는 과정은 Object zoom in/out에 속한다.
  • Select area는 편집이나 선택된 영역만 남기고 자르기 등의 기능으로 이어진다.

Example : iOS_PopAGraph

Select area.jpeg


Select area (Rectangular marquee tool)

iOS_UPAD


Select area (Lasso tool)

iOS_UPAD

iOS_PopAGraph


Select area (Control pointers)

iOS_Picsplay

iOS_Adobe Photoshop Express

iOS_Genius Scan