JP2020061193A - Control program, method for control, and information processor - Google Patents
Control program, method for control, and information processor Download PDFInfo
- Publication number
- JP2020061193A JP2020061193A JP2020008249A JP2020008249A JP2020061193A JP 2020061193 A JP2020061193 A JP 2020061193A JP 2020008249 A JP2020008249 A JP 2020008249A JP 2020008249 A JP2020008249 A JP 2020008249A JP 2020061193 A JP2020061193 A JP 2020061193A
- Authority
- JP
- Japan
- Prior art keywords
- control unit
- input
- start position
- erasing
- touch
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 84
- 238000012937 correction Methods 0.000 claims description 32
- 230000010365 information processing Effects 0.000 claims description 17
- 238000012545 processing Methods 0.000 description 86
- 230000008569 process Effects 0.000 description 65
- 230000006870 function Effects 0.000 description 24
- 238000001514 detection method Methods 0.000 description 10
- 238000004891 communication Methods 0.000 description 7
- 230000000694 effects Effects 0.000 description 6
- 230000009466 transformation Effects 0.000 description 6
- 238000000605 extraction Methods 0.000 description 5
- 230000008859 change Effects 0.000 description 3
- 230000003213 activating effect Effects 0.000 description 2
- 238000012217 deletion Methods 0.000 description 2
- 230000037430 deletion Effects 0.000 description 2
- 230000009467 reduction Effects 0.000 description 2
- 230000001131 transforming effect Effects 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 1
- 239000000284 extract Substances 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 238000010079 rubber tapping Methods 0.000 description 1
- 230000001360 synchronised effect Effects 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
Landscapes
- User Interface Of Digital Computer (AREA)
Abstract
Description
本発明は、描画を支援するための制御プログラム、制御方法及び情報処理装置に関する。 The present invention relates to a control program, a control method, and an information processing device for supporting drawing.
タブレット端末等のコンピュータ端末では、タッチパネルディスプレイにおいて各種操作を行なう。このようなタッチパネルディスプレイを用いることにより、直感的な操作が可能となる。そこで、タッチパネル式の表示部を備える携帯端末装置でタッチパネル全面のタッチ操作を実現する技術が開示されている（例えば、特許文献１）。この文献に記載された技術では、端末の傾きの変化を検出し、傾きの方向を判定し、判定した内容に基づき、タッチパネルでの操作を伴う操作子を含んだ画面の表示位置を移動させ、操作子に対する操作を受け付ける。 In a computer terminal such as a tablet terminal, various operations are performed on the touch panel display. By using such a touch panel display, intuitive operation becomes possible. Therefore, there is disclosed a technique for realizing a touch operation on the entire surface of the touch panel with a mobile terminal device including a touch panel type display unit (for example, Patent Document 1). In the technology described in this document, the change in the tilt of the terminal is detected, the direction of the tilt is determined, and based on the content of the determination, the display position of the screen including the operator accompanied by the operation on the touch panel is moved, Accepts operations on controls.
また、タッチ操作により描画像を生成する技術も検討されている（例えば、特許文献２）。この文献記載のタッチ操作入力装置は、表示画面に対してタッチ操作により入力を可能とするものであり、タッチ操作を検出するタッチ操作検出部と、タッチ操作検出部の検出結果により操作内容を判定して処理を行なう操作処理部とを備える。操作処理の判定結果により、メニューの表示処理とメニュー項目の処理や、描画モードの場合、タッチ部分に描画像を生成する処理を実行する。そして、タッチ操作をメニュー処理の操作と判定した場合、画像処理部は、描画モードであっても、タッチ操作による描画像を消去する。 Also, a technique of generating a drawn image by a touch operation has been studied (for example, Patent Document 2). The touch operation input device described in this document enables input by touch operation on a display screen, and determines the operation content by the touch operation detection unit that detects the touch operation and the detection result of the touch operation detection unit. And an operation processing unit that performs processing. Depending on the determination result of the operation process, the process of displaying the menu and the process of the menu item, and in the case of the drawing mode, the process of generating the drawn image on the touch portion is executed. When the touch operation is determined as the operation of the menu processing, the image processing unit erases the drawn image by the touch operation even in the drawing mode.
しかしながら、タッチパネルディスプレイにおいて、指等によるタッチ操作を行なう場合、的確な操作が困難なことがある。例えば、指先の大きさに対して、タッチパネルディスプレイが比較的小さく、表示領域も小さい場合、タッチパネルディスプレイ上の表示が指に隠れ、的確な操作が難しい。タッチパネルディスプレイに表示された画像を拡大して操作することも可能であるが、画像の拡大には手間がかかり、効率的な操作を実現することができない。 However, when performing a touch operation with a finger or the like on the touch panel display, it may be difficult to perform an accurate operation. For example, when the touch panel display is relatively small and the display area is small with respect to the size of the fingertip, the display on the touch panel display is hidden by the finger, and precise operation is difficult. It is possible to operate by enlarging the image displayed on the touch panel display, but enlarging the image is time-consuming and an efficient operation cannot be realized.
本発明は、上記問題点を解決するためになされたものであり、効率的かつ的確な描画を支援するための制御プログラム、制御方法及び情報処理装置を提供することにある。 The present invention has been made to solve the above problems, and an object of the present invention is to provide a control program, a control method, and an information processing apparatus for supporting efficient and accurate drawing.
上記課題を解決する制御プログラムは、制御部と入力操作が可能な表示部とを備えた情報処理装置を制御するプログラムであって、前記制御部に、消去機能の選択を受け付ける選択ステップと、前記表示部での入力位置に応じた消去開始位置を特定する特定ステップと、前記消去開始位置を特定するための入力操作の後に入力され、前記消去開始位置から離れた操作開始位置を始点とする軌跡に応じて前記表示部の描画領域に表示されたオブジェクトを消去する消去ステップと、を実行させる。 A control program for solving the above problem is a program for controlling an information processing apparatus including a control unit and a display unit capable of input operation, wherein the control unit has a selection step of receiving selection of an erasing function, A specifying step of specifying an erasing start position according to an input position on the display unit, and a locus which is input after an input operation for specifying the erasing starting position and whose starting point is an operation starting position distant from the erasing starting position And an erasing step of erasing the object displayed in the drawing area of the display unit.
上記制御プログラムについて、前記消去ステップでは、前記操作開始位置を始点とする
軌跡に応じて、背景色による線画を描画することにより、前記表示部の画面に表示されたオブジェクトを消去する。
With respect to the above control program, in the erasing step, the object displayed on the screen of the display unit is erased by drawing a line drawing in the background color in accordance with the locus starting from the operation start position.
上記制御プログラムについて、前記表示部に表示されたオブジェクトの操作を検知した場合、前記表示部での入力位置に応じてオブジェクトを特定するステップと、前記オブジェクトが特定された後に入力された位置からの軌跡に応じて前記第１オブジェクトの操作を行うステップとを、前記制御部に実行させる。 With respect to the control program, when the operation of the object displayed on the display unit is detected, the step of specifying the object according to the input position on the display unit, and the step from the position input after the object is specified Causing the control unit to execute a step of operating the first object according to a trajectory.
上記制御プログラムについて、前記表示部に表示されたオブジェクトの選択を検知した場合、前記オブジェクトの配置位置を特定するステップと、前記オブジェクトの配置を決定するステップとを、前記制御部に実行させる。 With respect to the control program, when the selection of the object displayed on the display unit is detected, the control unit is caused to execute the step of specifying the arrangement position of the object and the step of determining the arrangement of the object.
上記制御プログラムについて、前記描画領域で編集されたオブジェクトをソーシャルネットワークサービスで利用するステップを前記制御部に実行させる。 The control unit causes the control unit to execute a step of using the object edited in the drawing area in a social network service.
上記制御プログラムについて、前記描画領域にテキスト入力を行うためのソフトウェアキーボードを表示するための操作を受け付ける第１受付ステップを前記制御部に実行させる。 With respect to the control program, the control unit is caused to execute a first receiving step of receiving an operation for displaying a software keyboard for inputting text in the drawing area.
上記制御プログラムについて、前記描画領域に、前記情報処理装置に設けられたカメラにより撮影された画像を表示するための操作を受け付ける第２受付ステップを前記制御部に実行させる。 With respect to the control program, the control unit is caused to execute a second acceptance step of accepting an operation for displaying an image captured by a camera provided in the information processing device in the drawing area.
上記制御プログラムについて、前記操作開始位置からの軌跡を補正するための補正ベクトルを算出するステップと、前記補正ベクトルを、前記入力位置の面積に応じて変更するステップとを、前記制御部に実行させる。
上記制御プログラムについて、前記操作開始位置からの軌跡を補正するための補正ベクトルを算出するステップと、前記補正ベクトルを、前記第２座標からの軌跡の修正履歴に基づき変更するステップとを、前記制御部に実行させる。
上記課題を解決する制御方法は、制御部と入力操作が可能な表示部とを備えた情報処理装置を制御する制御方法であって、前記制御部が、消去機能の選択を受け付ける選択ステップと、前記表示部での入力位置に応じた消去開始位置を特定する特定ステップと、前記消去開始位置を特定するための入力操作の後に入力され、前記消去開始位置から離れた操作開始位置と始点とする軌跡に応じて前記表示部の画面に表示された線画や図形を消去する消去ステップと、を実行する。
上記課題を解決する情報処理装置は、入力操作が可能な表示部とを備えた情報処理装置であって、消去機能の選択を受け付ける選択部と、上記課題を解決する情報処理装置は、前記表示部での入力位置に応じた消去開始位置を特定する特定部と、前記消去開始位置を特定するための入力操作の後に入力され、前記消去開始位置から離れた操作開始位置を始点とする軌跡に応じて前記表示部の画面に表示された線画や図形を消去する消去制御部と、を備える。
With respect to the control program, the control unit is made to execute a step of calculating a correction vector for correcting the locus from the operation start position, and a step of changing the correction vector according to the area of the input position. .
With respect to the control program, the steps of calculating a correction vector for correcting the locus from the operation start position and changing the correction vector based on the locus correction history from the second coordinates Let the department do it.
A control method for solving the above problem is a control method for controlling an information processing device including a control unit and a display unit capable of input operation, wherein the control unit has a selection step of receiving selection of an erasing function, A specifying step of specifying an erasing start position according to the input position on the display unit, and an operation starting position and a starting point which are input after an input operation for specifying the erasing starting position and are separated from the erasing starting position And an erasing step of erasing the line drawing or figure displayed on the screen of the display unit according to the trajectory.
An information processing apparatus that solves the above problem is an information processing apparatus that includes a display unit that can perform an input operation, and a selection unit that accepts selection of an erase function, and an information processing apparatus that solves the above problem are Specifying section for specifying the erasing start position according to the input position in the section, and inputting after the input operation for specifying the erasing start position, and the trajectory starting from the operation starting position distant from the erasing start position And an erasing control unit for erasing the line drawing or figure displayed on the screen of the display unit.
本発明によれば、コンピュータ端末において、効率的かつ的確な描画を支援することができる。 According to the present invention, it is possible to support efficient and accurate drawing in a computer terminal.
（第１の実施形態）
以下、図１〜図６に従って、本発明を具体化した描画処理装置の第１の実施形態を説明する。本実施形態では、ユーザ端末１０に表示された画面において描画を行なう場合を説明する。
(First embodiment)
Hereinafter, a first embodiment of a drawing processing apparatus embodying the present invention will be described with reference to FIGS. In the present embodiment, a case will be described in which drawing is performed on the screen displayed on the user terminal 10.
ユーザ端末１０は、利用者が用いるコンピュータ端末（描画処理装置）であって、各種アプリケーションを実行させることにより、情報の出力や入力に用いられる。
図１に示すように、本実施形態では、このユーザ端末１０は、制御部１１、メモリ１２、通信部１３、タッチパネルディスプレイ１４を備えている。
The user terminal 10 is a computer terminal (drawing processing device) used by a user, and is used for outputting and inputting information by executing various applications.
As shown in FIG. 1, in the present embodiment, the user terminal 10 includes a control unit 11, a memory 12, a communication unit 13, and a touch panel display 14.
制御部１１は、後述する処理（表示制御段階、タッチ制御段階、アプリケーション実行段階、描画処理段階、ＳＮＳ処理段階等の各処理等）を行なう。そして、制御部１１は、図１に示すように、表示制御部１１１、タッチ制御部１１２、アプリケーション実行部１１３として機能するとともに、アプリケーションプログラムを実行することにより、描画処理部１１４、ＳＮＳ処理部１１５として機能する。 The control unit 11 performs the processes described below (display control stage, touch control stage, application execution stage, drawing process stage, SNS process stage, and the like). Then, as shown in FIG. 1, the control unit 11 functions as a display control unit 111, a touch control unit 112, and an application execution unit 113, and executes an application program to draw the processing unit 114 and the SNS processing unit 115. Function as.
表示制御部１１１は、タッチパネルディスプレイ１４における表示を制御する処理を実行する。具体的には、タッチパネルディスプレイ１４に出力された表示画面の階層（表示レイヤ）を制御する。本実施形態では、描画を行なう描画レイヤと、この描画レイヤと位置を同期され、カーソルや図形の枠線を表示する操作レイヤとを含む。 The display control unit 111 executes processing for controlling display on the touch panel display 14. Specifically, the hierarchy (display layer) of the display screen output to the touch panel display 14 is controlled. In the present embodiment, a drawing layer for drawing and an operation layer that is synchronized in position with the drawing layer and displays a cursor or a frame of a figure are included.
タッチ制御部１１２は、タッチパネルディスプレイ１４におけるタッチを検知する処理を実行する。
アプリケーション実行部１１３は、ユーザ端末１０に格納されたアプリケーション（例えば、情報共有、ソーシャルネットワークサービス等）のアプリケーション起動、実行等の管理を行なう。
The touch control unit 112 executes a process of detecting a touch on the touch panel display 14.
The application execution unit 113 manages application startup and execution of applications (for example, information sharing, social network services, etc.) stored in the user terminal 10.
描画処理部１１４は、タッチパネルディスプレイ１４における線画や図形の描画を制御する処理を実行する。描画処理部１１４は、上述した描画レイヤにおいて画面を出力する。本実施形態では、描画レイヤには、ＨＴＭＬ５のcanvas要素の「Canvas API」を利用し、操作レイヤには、ＨＴＭＬのＤＯＭ（Document Object Model）を利用する。これにより、描画レイヤにおける処理負担を軽減することができる。そして、操作レイヤでのカーソルの位置情報の更新は、高い頻度で行なうが、描画レイヤでの図形の更新は、新しいオブジェクトが追加されたとき等、頻度を低くして、処理負荷を軽減する。
ＳＮＳ処理部１１５は、ソーシャルネットワークサービス（ＳＮＳ）を利用する処理を実行する。ここでは、ユーザ端末１０（描画処理装置）と、通信可能なサーバ装置（図示
せず）が生成したデータに基づいて、ユーザ端末１０のタッチパネルディスプレイ１４に画面を表示させるウェブ表示を行なう。
The drawing processing unit 114 executes processing for controlling drawing of a line drawing or a figure on the touch panel display 14. The drawing processing unit 114 outputs the screen in the drawing layer described above. In the present embodiment, the "Canvas API" of the HTML5 canvas element is used for the drawing layer, and the HTML DOM (Document Object Model) is used for the operation layer. As a result, the processing load on the drawing layer can be reduced. The cursor position information on the operation layer is updated frequently, but the graphics on the drawing layer is updated less frequently, such as when a new object is added, to reduce the processing load.
The SNS processing unit 115 executes processing using a social network service (SNS). Here, web display is performed to display a screen on the touch panel display 14 of the user terminal 10 based on the data generated by the user terminal 10 (drawing processing device) and the communicable server device (not shown).
メモリ１２には、タッチパネルディスプレイ１４において描画に用いる情報を記録する。例えば、タッチパネルディスプレイ１４において検知したスライド軌跡や、このスライド軌跡により生成された図形（オブジェクト）を仮記憶する。例えば、操作レイヤでのカーソルの位置情報を更新したり、描画の一時保存が指示された場合や、描画処理プログラムが停止した場合には、描画レイヤで生成されたオブジェクトを更新したりする。 Information used for drawing on the touch panel display 14 is recorded in the memory 12. For example, the slide locus detected on the touch panel display 14 and the figure (object) generated by this slide locus are temporarily stored. For example, the position information of the cursor in the operation layer is updated, the object generated in the drawing layer is updated when temporary saving of drawing is instructed, or when the drawing processing program is stopped.
通信部１３は、ネットワークを介して、サーバ装置や他のユーザ端末と通信を行なう。
タッチパネルディスプレイ１４は、表示手段及び入力手段として機能する。具体的には、パネル上に情報を出力するとともに、パネル表面に触れる（タッチする）ことにより、タッチされた画面位置の情報を感知して各種操作（例えば、タップ、スライド、スワイプ、フリック等）を行なうことができる。
The communication unit 13 communicates with the server device and other user terminals via the network.
The touch panel display 14 functions as a display unit and an input unit. Specifically, while outputting the information on the panel and touching (touching) the surface of the panel, the information of the touched screen position is detected and various operations (for example, tap, slide, swipe, flick, etc.) Can be done.
（ハードウェア構成例）
図２は、ユーザ端末１０のハードウェア構成例である。
ユーザ端末１０は、通信インターフェースＨ１１、入力装置Ｈ１２、表示装置Ｈ１３、記憶部Ｈ１４、プロセッサＨ１５を有する。なお、このハードウェア構成は一例であり、他のハードウェアを有していてもよい。
(Example of hardware configuration)
FIG. 2 is a hardware configuration example of the user terminal 10.
The user terminal 10 includes a communication interface H11, an input device H12, a display device H13, a storage unit H14, and a processor H15. Note that this hardware configuration is an example, and other hardware may be included.
通信インターフェースＨ１１は、他の装置との間で通信経路を確立して、データの送受信を実行するインターフェースであり、通信部１３を実現する。例えばネットワークインターフェースカードや無線インターフェース等である。 The communication interface H11 is an interface that establishes a communication path with another device and transmits and receives data, and realizes the communication unit 13. For example, a network interface card, a wireless interface, or the like.
入力装置Ｈ１２は、ユーザ等からの入力を受け付ける装置である。表示装置Ｈ１３は、各種情報を表示するディスプレイ等である。本実施形態では、入力装置Ｈ１２、表示装置Ｈ１３として、タッチパネルディスプレイ１４を用いる。 The input device H12 is a device that receives an input from a user or the like. The display device H13 is a display or the like that displays various information. In this embodiment, the touch panel display 14 is used as the input device H12 and the display device H13.
記憶部Ｈ１４は、ユーザ端末１０の各種機能を実行するためのデータや各種プログラムを格納する記憶装置であり、メモリ１２を実現する。記憶部Ｈ１４の一例としては、ＲＯＭ、ＲＡＭ、ハードディスク等がある。 The storage unit H14 is a storage device that stores data and various programs for executing various functions of the user terminal 10, and implements the memory 12. Examples of the storage unit H14 include a ROM, a RAM, a hard disk, and the like.
プロセッサＨ１５は、記憶部Ｈ１４に記憶されるプログラムやデータを用いて、ユーザ端末１０における各処理を制御する制御部１１を実現する。プロセッサＨ１５の一例としては、例えばＣＰＵやＭＰＵ等がある。このプロセッサＨ１５は、ＲＯＭ等に記憶されるプログラムをＲＡＭに展開して、各種処理に対応する各種プロセスを実行する。 The processor H15 implements the control unit 11 that controls each process in the user terminal 10 using the programs and data stored in the storage unit H14. Examples of the processor H15 include CPU and MPU. The processor H15 expands a program stored in a ROM or the like into a RAM and executes various processes corresponding to various processes.
（ユーザ端末１０における動作）
次に、図３〜図６を用いて、このユーザ端末１０における動作を説明する。所定のアプリケーションにおいて、ユーザが描画を行なう場合には、ユーザ端末１０のタッチパネルディスプレイ１４を用いて、描画機能を指示する。
(Operation in user terminal 10)
Next, the operation of the user terminal 10 will be described with reference to FIGS. When the user draws in a predetermined application, the touch panel display 14 of the user terminal 10 is used to instruct the drawing function.
この場合、図３に示すように、制御部１１のアプリケーション実行部１１３は、描画処理部１１４、ＳＮＳ処理部１１５を起動し、タッチパネルディスプレイ１４に表示画面２００を出力する。この表示画面２００には、ツールメニュー２１０、描画エリア２２０が表示される。 In this case, as shown in FIG. 3, the application execution unit 113 of the control unit 11 activates the drawing processing unit 114 and the SNS processing unit 115 and outputs the display screen 200 to the touch panel display 14. A tool menu 210 and a drawing area 220 are displayed on the display screen 200.
ツールメニュー２１０には、描画ボタン２１１、消しゴムボタン２１２、図形ボタン２１３、テキストボタン２１４、カメラボタン２１５、アシストボタン２１６等が表示され
る。
On the tool menu 210, a drawing button 211, an eraser button 212, a graphic button 213, a text button 214, a camera button 215, an assist button 216, etc. are displayed.
描画ボタン２１１は、描画エリア２２０での線画の描画に用いる線種（描画ツール）を選択するためのツール画面を表示する場合に用いる。
消しゴムボタン２１２は、描画エリア２２０に表示された線画や図形を部分的に消去するための消しゴムツールを表示する場合に用いる。
The drawing button 211 is used to display a tool screen for selecting a line type (drawing tool) used for drawing a line drawing in the drawing area 220.
The eraser button 212 is used to display an eraser tool for partially erasing the line drawing or figure displayed in the drawing area 220.
図形ボタン２１３は、描画エリア２２０に、予め準備された図形（例えば、正方形、円形、矢印、ハート型等）を配置するための図形ツールを表示する場合に用いる。
テキストボタン２１４は、描画エリア２２０に、テキスト入力を行なうためのソフトウェアキーボードを表示する場合に用いる。
The graphic button 213 is used to display a graphic tool for arranging a prepared graphic (for example, a square, a circle, an arrow, a heart shape, etc.) in the drawing area 220.
The text button 214 is used when displaying a software keyboard for inputting text in the drawing area 220.
カメラボタン２１５は、描画エリア２２０に、カメラにより撮影された画像等を表示する場合に用いる。
アシストボタン２１６は、描画エリア２２０における描画を支援するための機能を実行するためのボタンである。このアシストボタン２１６を選択することにより、各種アシスト機能の一覧がプルダウンされる。本実施形態では、アシスト機能には、「ポインターモード」、「拡大・縮小モード」、「一時保存」、「一時保存呼び出し」、「ヘルプ」等の機能が含まれる。
The camera button 215 is used when displaying an image or the like taken by the camera in the drawing area 220.
The assist button 216 is a button for executing a function for supporting drawing in the drawing area 220. By selecting the assist button 216, a list of various assist functions is pulled down. In the present embodiment, the assist function includes functions such as "pointer mode", "enlargement / reduction mode", "temporary save", "temporary save call", and "help".
「ポインターモード」は、後述するように、描画位置に対して離れた操作位置での描画を支援する機能である。
「拡大・縮小モード」は、描画エリア２２０の拡大、縮小を行なう機能である。
「一時保存」は、描画エリア２２０における描画内容をメモリ１２に一時的に保存する機能であり、「一時保存呼び出し」は、メモリに一時的に保存された描画内容を描画エリア２２０に呼び出す機能である。
「ヘルプ」は、ツールメニュー２１０に表示された各ボタン等の説明を、吹き出しアイコンにより出力する機能である。
The “pointer mode” is a function that supports drawing at an operation position distant from the drawing position, as described later.
The “enlargement / reduction mode” is a function of enlarging and reducing the drawing area 220.
"Temporary save" is a function of temporarily saving the drawing content in the drawing area 220 in the memory 12, and "temporary save call" is a function of calling the drawing content temporarily saved in the memory to the drawing area 220. is there.
The “help” is a function of outputting a description of each button and the like displayed on the tool menu 210 using a balloon icon.
（ポインターモード処理）
以下、図４を用いて、アシストボタン２１６を用いて「ポインターモード」を指定した場合のポインターモード処理を説明する。このポインターモード処理においては、例えば、描画ツールを用いて線画を描く場合、描画を行なう領域とは離れた位置におけるスライド操作により、線画を描くことができる。
(Pointer mode processing)
The pointer mode processing when the "pointer mode" is designated using the assist button 216 will be described below with reference to FIG. In this pointer mode processing, for example, when drawing a line drawing using a drawing tool, the line drawing can be drawn by a slide operation at a position apart from the drawing area.
まず、ユーザ端末１０の制御部１１は、描画ツールの指定処理を実行する（ステップＳ１−１）。具体的には、ツールメニュー２１０において、描画ボタン２１１を選択する。この場合、制御部１１の描画処理部１１４は、タッチパネルディスプレイ１４にツール画面を出力する。このツール画面においては、線画を描くための線種（配色、太さ、透明度、縁つき等）の選択画面が含まれる。 First, the control unit 11 of the user terminal 10 executes a drawing tool designation process (step S1-1). Specifically, in the tool menu 210, the drawing button 211 is selected. In this case, the drawing processing unit 114 of the control unit 11 outputs the tool screen to the touch panel display 14. This tool screen includes a screen for selecting a line type (color arrangement, thickness, transparency, bordering, etc.) for drawing a line drawing.
次に、ユーザ端末１０の制御部１１は、描画開始位置の設定処理を実行する（ステップＳ１−２）。具体的には、線画を描く場合、描画エリア２２０において、線画の描画開始位置を、タッチパネルディスプレイ１４上をタッチしてすぐに離す「タップ」を行なう。この場合、制御部１１のタッチ制御部１１２は、描画エリア２２０においてタップ位置（座標）を特定する。そして、描画処理部１１４は、タップ位置に線画を描くためのポインタ（カーソル）を配置する。 Next, the control unit 11 of the user terminal 10 executes a drawing start position setting process (step S1-2). Specifically, when drawing a line drawing, a "tap" is performed in the drawing area 220 where the drawing start position of the line drawing is touched on the touch panel display 14 and immediately released. In this case, the touch control unit 112 of the control unit 11 specifies the tap position (coordinates) in the drawing area 220. Then, the drawing processing unit 114 places a pointer (cursor) for drawing a line drawing at the tap position.
図３に示すように、描画エリア２２０において、タップを検知した場合、描画処理部１１４は、ポインタ２３０を表示する。後述するように、このポインタ２３０は、ペンとし
て機能し、ポインタ２３０を移動させることにより線画を描くことができる。
As shown in FIG. 3, when a tap is detected in the drawing area 220, the drawing processing unit 114 displays the pointer 230. As will be described later, the pointer 230 functions as a pen, and by moving the pointer 230, a line drawing can be drawn.
次に、ユーザ端末１０の制御部１１は、操作開始位置の設定処理を実行する（ステップＳ１−３）。具体的には、配置されたポインタを用いて、線画を描く場合、描画エリア２２０において、再度、任意の位置をタッチする。ここでは、描画開始位置と異なる位置をタッチすることができる。この場合、制御部１１の描画処理部１１４は、再度タッチされた位置を操作開始位置として設定する。
ここで、描画エリア２２０の座標を（ｘ，ｙ）で表現した場合、操作開始位置の座標（ｘ２，ｙ２）から描画開始位置の座標（ｘ１，ｙ１）への補正ベクトル（ｘ３，ｙ３）〔＝（ｘ１−ｘ２，ｙ１−ｙ２）〕を算出する。
Next, the control unit 11 of the user terminal 10 executes an operation start position setting process (step S1-3). Specifically, when a line drawing is drawn using the arranged pointer, an arbitrary position is touched again in the drawing area 220. Here, a position different from the drawing start position can be touched. In this case, the drawing processing unit 114 of the control unit 11 sets the retouched position as the operation start position.
Here, when the coordinates of the drawing area 220 are expressed by (x, y), the correction vector (x3, y3) [from the coordinates (x2, y2) of the operation start position to the coordinates (x1, y1) of the drawing start position] = (X1-x2, y1-y2)] is calculated.
次に、ユーザ端末１０の制御部１１は、タッチオフかどうかについての判定処理を実行する（ステップＳ１−４）。具体的には、線画を描く場合には、操作レイヤにおいて、タッチを継続しながら、タッチ位置を移動させるスライドを行なう。制御部１１のタッチ制御部１１２は、タッチ位置のスライドを検知しながら、タッチパネルディスプレイ１４からのタッチの離脱（タッチオフ）を待機する。
この場合、新たなスライド位置の座標（ｘｉ，ｙｉ）について、補正ベクトル（ｘ３，ｙ３）を用いて、ポインタ位置（ｘｉ＋ｘ３，ｙｉ＋ｙ３）を算出して、このポインタ位置で描画を行なう。
Next, the control unit 11 of the user terminal 10 executes a determination process regarding whether or not the touch is off (step S1-4). Specifically, when drawing a line drawing, the operation layer is slid to move the touch position while continuing the touch. The touch control unit 112 of the control unit 11 waits for a touch release (touch-off) from the touch panel display 14 while detecting the slide of the touch position.
In this case, for the coordinates (xi, yi) of the new slide position, the correction vector (x3, y3) is used to calculate the pointer position (xi + x3, yi + y3), and drawing is performed at this pointer position.
タッチオフでないと判定した場合（ステップＳ１−４において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、スライド軌跡に応じた描画処理を実行する（ステップＳ１−５）。具体的には、制御部１１のタッチ制御部１１２は、操作開始位置を始点とするスライド軌跡と同様に、ポインタを移動させる。この場合、タッチ位置（座標）と描画を行なうポインタ位置（座標）は、操作開始位置（座標）と描画開始位置（座標）との相対位置関係を保持する。その結果、描画処理部１１４は、描画開始位置から、スライド軌跡と同じ線画を描画エリア２２０に表示する。 When it is determined that the touch-off is not performed (“NO” in step S1-4), the control unit 11 of the user terminal 10 executes the drawing process according to the slide trajectory (step S1-5). Specifically, the touch control unit 112 of the control unit 11 moves the pointer in the same manner as the slide locus starting from the operation start position. In this case, the touch position (coordinates) and the pointer position (coordinates) for drawing hold the relative positional relationship between the operation start position (coordinates) and the drawing start position (coordinates). As a result, the drawing processing unit 114 displays the same line drawing as the slide trajectory in the drawing area 220 from the drawing start position.
図５に示すように、スライド軌跡２４０と同様に、ポインタ２３０が移動することにより、スライド軌跡２４０とは離れた位置に線画２４１が生成される。
一方、タッチオフと判定した場合（ステップＳ１−４において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、オブジェクト設定処理を実行する（ステップＳ１−６）。具体的には、制御部１１の描画処理部１１４は、描画を終了し、ポインタにより描かれた線画２４１を、表示レイヤにオブジェクトとして書き込む。
As shown in FIG. 5, as with the slide locus 240, the pointer 230 moves to generate a line drawing 241 at a position away from the slide locus 240.
On the other hand, when it is determined that the touch is off (in the case of “YES” in step S1-4), the control unit 11 of the user terminal 10 executes the object setting process (step S1-6). Specifically, the drawing processing unit 114 of the control unit 11 ends the drawing and writes the line drawing 241 drawn by the pointer as an object in the display layer.
完成した線画２４１に対して、新たな線画を生成する場合には、再度、描画開始位置の設定処理（ステップＳ１−２）から繰り返す。
例えば、図６に示すように、最初の線画２４１に接続した新たな線画を描く場合には、接続位置をタップすることにより、描画開始位置２４２を設定する。そして、再度、描画エリア２２０のいずれかの場所をタッチし、この操作開始位置を始点とするスライド軌跡２４３で指をスライドさせる。この場合、新たな線画２４４が生成される。
そして、ＳＮＳ処理部１１５は、この線画２４４のオブジェクトを含む画像を用いて、ソーシャルネットワークサービスを利用する。
When a new line drawing is generated with respect to the completed line drawing 241, the drawing start position setting process (step S1-2) is repeated again.
For example, as shown in FIG. 6, when drawing a new line drawing connected to the first line drawing 241, the drawing start position 242 is set by tapping the connection position. Then, again, any place in the drawing area 220 is touched, and the finger is slid on the slide locus 243 whose starting point is the operation start position. In this case, a new line drawing 244 is generated.
Then, the SNS processing unit 115 uses the image including the object of the line drawing 244 to use the social network service.
以上、本実施形態によれば、以下に示す効果を得ることができる。
（１）上記実施形態では、ユーザ端末１０の制御部１１は、描画開始位置の設定処理（ステップＳ１−２）、操作開始位置の設定処理（ステップＳ１−３）、スライド軌跡に応じた描画処理（ステップＳ１−５）を実行する。これにより、描画領域とは異なる位置でのタッチ操作により、描画を行なうことができる。従って、タッチ操作時において指により描画領域が隠れることなく、的確かつ効率的な描画を行なうことができる。更に、操作
開始位置を任意に設定することができるので、ユーザにとって都合がよい領域で、スライド操作を行なうことができる。
As described above, according to this embodiment, the following effects can be obtained.
(1) In the above embodiment, the control unit 11 of the user terminal 10 sets the drawing start position (step S1-2), sets the operation start position (step S1-3), and draws according to the slide trajectory. (Step S1-5) is executed. As a result, drawing can be performed by a touch operation at a position different from the drawing area. Therefore, it is possible to perform accurate and efficient drawing without the drawing area being hidden by the finger during the touch operation. Further, since the operation start position can be arbitrarily set, the slide operation can be performed in the area convenient for the user.
（第２の実施形態）
次に、図７〜図１２を用いて、第２の実施形態を説明する。第１の実施形態においては、線画を作成する場合を説明した。第２の実施形態は、第１の実施形態において、図形を作成する構成であり、同様の部分については詳細な説明を省略する。
(Second embodiment)
Next, a second embodiment will be described with reference to FIGS. In the first embodiment, the case of creating a line drawing has been described. The second embodiment has a configuration in which a graphic is created in the first embodiment, and detailed description of similar parts is omitted.
図形を用いて描画を行なう場合、図３のツールメニュー２１０において、図形ボタン２１３を選択する。この場合、制御部１１の描画処理部１１４は、ツール画面を出力する。このツール画面においては、描画に用いる図形（例えば、正方形、円形、矢印、ハート型等）や、図形属性（配色、太さ、透明度、縁つき等）の選択画面が含まれる。そして、ツール画面において「配置」ボタンが選択された場合、描画処理部１１４は、選択された図形（ここでは、ハート型）のオブジェクトを、描画エリア２２０に表示する。そして、図形のオブジェクトの変形や回転、配置の変更を行なう。 When drawing using a figure, the figure button 213 is selected in the tool menu 210 of FIG. In this case, the drawing processing unit 114 of the control unit 11 outputs the tool screen. This tool screen includes a graphic (for example, square, circle, arrow, heart-shaped, etc.) used for drawing, and a graphic attribute (color arrangement, thickness, transparency, border, etc.) selection screen. When the “arrange” button is selected on the tool screen, the drawing processing unit 114 displays the selected graphic (here, heart-shaped) object in the drawing area 220. Then, the object of the figure is deformed, rotated, and the arrangement is changed.
図７に示すように、図形のオブジェクト３００の内部や周囲には、複数の操作エリアを設定する。本実施形態では、オブジェクト３００の内部及び周辺に９個の操作エリアが設定される。オブジェクト３００を包含する矩形の各頂点３０１〜３０４及び頂点間の線分のスライド操作（移動）により、オブジェクト３００の変形操作を行なう。更に、オブジェクト３００内部のスライド操作（移動）により、オブジェクト３００全体の移動操作を行なう。 As shown in FIG. 7, a plurality of operation areas are set inside or around the graphic object 300. In this embodiment, nine operation areas are set inside and around the object 300. The object 300 is deformed by sliding (moving) each of the vertices 301 to 304 of the rectangle including the object 300 and a line segment between the vertices. Further, a sliding operation (movement) inside the object 300 is performed to move the entire object 300.
このために、頂点３０１〜３０４の周囲には、それぞれ変形操作エリア３１１〜３１４が設けられている。変形操作エリア３１１〜３１４の大きさは、例えば、矩形の短辺の所定割合や所定長さの辺からなる正方形を用いる。変形操作エリア３１１をタッチしてスライド操作が行なわれた場合には、頂点３０１の配置を変更する。変形操作エリア３１２をタッチしてスライド操作が行なわれた場合には、頂点３０２の配置を変更する。変形操作エリア３１３をタッチしてスライド操作が行なわれた場合には、頂点３０３の配置を変更する。変形操作エリア３１４をタッチしてスライド操作が行なわれた場合には、頂点３０４の配置を変更する。 Therefore, deformation operation areas 311 to 314 are provided around the vertices 301 to 304, respectively. As the size of the deformation operation areas 311 to 314, for example, a square having a predetermined ratio of short sides of a rectangle or a side having a predetermined length is used. When the deformation operation area 311 is touched and a slide operation is performed, the arrangement of the vertices 301 is changed. When the deformation operation area 312 is touched and a slide operation is performed, the arrangement of the vertices 302 is changed. When the deformation operation area 313 is touched and a slide operation is performed, the arrangement of the vertices 303 is changed. When the deformation operation area 314 is touched and a slide operation is performed, the arrangement of the vertices 304 is changed.
また、頂点３０１〜３０４間の各辺に対応して、変形操作エリア３２１〜３２４が設けられている。変形操作エリア３２１は右辺を左右に移動する操作が行なわれた場合、右辺を位置を変更してオブジェクト３００を変形する。変形操作エリア３２２は左辺を左右に移動する操作が行なわれた場合、左辺を位置を変更してオブジェクト３００を変形する。変形操作エリア３２３は上辺を上下に移動する操作が行なわれた場合、上辺を位置を変更してオブジェクト３００を変形する。変形操作エリア３２４は下辺を上下に移動する操作が行なわれた場合、下辺を位置を変更してオブジェクト３００を変形する。 Further, deformation operation areas 321 to 324 are provided corresponding to the respective sides between the vertices 301 to 304. In the transformation operation area 321, when an operation of moving the right side to the left or right is performed, the position of the right side is changed to transform the object 300. When an operation of moving the left side to the left or right is performed in the deformation operation area 322, the position of the left side is changed to deform the object 300. When an operation of moving the upper side up and down is performed in the deformation operation area 323, the position of the upper side is changed to deform the object 300. The deformation operation area 324 changes the position of the lower side and deforms the object 300 when an operation of moving the lower side up and down is performed.
更に、オブジェクト３００の内部には、変形操作エリア３１１〜３１４，３２１〜３２４に囲まれた移動操作エリア３３０を設ける。この移動操作エリア３３０がタッチされてスライド操作を検知した場合、オブジェクト３００の形状を維持しながらスライド方向に、オブジェクト３００全体を移動させる。 Furthermore, inside the object 300, a movement operation area 330 surrounded by the transformation operation areas 311 to 314 and 321 to 324 is provided. When the moving operation area 330 is touched and a sliding operation is detected, the entire object 300 is moved in the sliding direction while maintaining the shape of the object 300.
更に、変形操作エリア３１１〜３１４，３２１〜３２４の外側領域においても、オブジェクト３００に対する操作を行なう操作エリアを設ける。各操作エリア以外の外側領域においてスライドを検知した場合、オブジェクト３００の中心（オブジェクト内の基準位置）を軸としてオブジェクト３００全体を回転させる。なお、オブジェクト内の基準位置は、予め定められた位置であれば、オブジェクトの中心に限定されるものではない。 Further, an operation area for performing an operation on the object 300 is provided also in an area outside the deformation operation areas 311 to 314 and 321 to 324. When a slide is detected in an outer area other than each operation area, the entire object 300 is rotated around the center of the object 300 (reference position within the object) as an axis. The reference position in the object is not limited to the center of the object as long as it is a predetermined position.
（図形操作処理）
図８を用いて、各操作エリアを用いての図形操作を説明する。
まず、ユーザ端末１０の制御部１１は、オブジェクト選択処理を実行する（ステップＳ２−１）。具体的には、ツールメニュー２１０において、図形ボタン２１３を選択する。この場合、制御部１１の描画処理部１１４は、タッチパネルディスプレイ１４にツール画面を出力する。このツール画面を用いて、描画に用いる図形や図形属性を選択する。
(Figure operation processing)
Graphic operation using each operation area will be described with reference to FIG.
First, the control unit 11 of the user terminal 10 executes an object selection process (step S2-1). Specifically, in the tool menu 210, the graphic button 213 is selected. In this case, the drawing processing unit 114 of the control unit 11 outputs the tool screen to the touch panel display 14. This tool screen is used to select a graphic or graphic attribute to be used for drawing.
次に、ユーザ端末１０の制御部１１は、オブジェクト配置処理を実行する（ステップＳ２−２）。具体的には、ツール画面において配置ボタンを選択する。この場合、制御部１１の描画処理部１１４は、描画エリア２２０に、選択された図形のオブジェクト３００を配置する。 Next, the control unit 11 of the user terminal 10 executes an object placement process (step S2-2). Specifically, the placement button is selected on the tool screen. In this case, the drawing processing unit 114 of the control unit 11 arranges the object 300 of the selected figure in the drawing area 220.
次に、ユーザ端末１０の制御部１１は、タッチ位置の特定処理を実行する（ステップＳ２−３）。具体的には、制御部１１のタッチ制御部１１２は、描画エリア２２０において、オブジェクト３００に対して、タッチ位置の座標を特定する。 Next, the control unit 11 of the user terminal 10 executes a touch position identification process (step S2-3). Specifically, the touch control unit 112 of the control unit 11 specifies the coordinates of the touch position for the object 300 in the drawing area 220.
次に、ユーザ端末１０の制御部１１は、オブジェクト周辺内かどうかについての判定処理を実行する（ステップＳ２−４）。具体的には、制御部１１の描画処理部１１４は、タッチ位置と、オブジェクト３００に対して設定された操作エリアとの位置関係を特定する。タッチ位置が、変形操作エリア３１１〜３１４，３２１〜３２４、移動操作エリア３３０に含まれる場合には、オブジェクト周辺内と判定する。 Next, the control unit 11 of the user terminal 10 executes a determination process regarding whether or not it is within the vicinity of the object (step S2-4). Specifically, the drawing processing unit 114 of the control unit 11 specifies the positional relationship between the touch position and the operation area set for the object 300. When the touch position is included in the deformation operation areas 311 to 314, 321 to 324, and the movement operation area 330, it is determined that the touch position is inside the object.
オブジェクト周辺内に含まれないと判定した場合（ステップＳ２−４において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、スライド軌跡の回転角の算出処理を実行する（ステップＳ２−５）。具体的には、オブジェクトを回転させる場合、変形操作エリア３１１〜３１４，３２１〜３２４、移動操作エリア３３０の外側において、タッチ位置（スライド開始位置）からスライド操作を行なう。この場合、制御部１１のタッチ制御部１１２は、図形のオブジェクトの中心に対して、スライド開始位置から現在のタッチ位置までの広がり角度（回転角）を算出する。 When it is determined that the object is not included in the vicinity of the object (“NO” in step S2-4), the control unit 11 of the user terminal 10 executes the calculation process of the rotation angle of the slide trajectory (step S2-5). . Specifically, when the object is rotated, a slide operation is performed from the touch position (slide start position) on the outside of the deformation operation areas 311 to 314, 321 to 324, and the movement operation area 330. In this case, the touch control unit 112 of the control unit 11 calculates the spread angle (rotation angle) from the slide start position to the current touch position with respect to the center of the graphic object.
次に、ユーザ端末１０の制御部１１は、回転角に応じてオブジェクトの回転処理を実行する（ステップＳ２−６）。具体的には、制御部１１の描画処理部１１４は、この回転角に応じて、オブジェクト３００を回転させる。そして、スライド操作のタッチオフ時に、オブジェクト３００の配置を設定する。 Next, the control unit 11 of the user terminal 10 executes the object rotation processing according to the rotation angle (step S2-6). Specifically, the drawing processing unit 114 of the control unit 11 rotates the object 300 according to this rotation angle. Then, when the slide operation is touched off, the arrangement of the object 300 is set.
図９に示すように、オブジェクト３００の中心から、最初に検知したタッチ位置（スライド開始位置）から現在のタッチ位置までのスライド軌跡４００の広がり角度（回転角）を算出する。そして、この回転角を用いて、オブジェクト３００を回転させる。そして、描画処理部１１４は、スライド操作のタッチオフ時に、オブジェクト３００の配置を決定し、ＳＮＳ処理部１１５は、このオブジェクトを含む画像を用いて、ソーシャルネットワークサービスを利用する。 As shown in FIG. 9, the spread angle (rotation angle) of the slide trajectory 400 from the center of the object 300 to the touch position (slide start position) detected first to the current touch position is calculated. Then, the object 300 is rotated using this rotation angle. Then, the drawing processing unit 114 determines the arrangement of the object 300 when the slide operation is touched off, and the SNS processing unit 115 uses the image including the object to use the social network service.
一方、オブジェクト周辺内に含まれると判定した場合（ステップＳ２−４において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、移動操作かどうかについての判定処理を実行する（ステップＳ２−７）。具体的には、制御部１１のタッチ制御部１１２は、タッチ位置が、移動操作エリア３３０に含まれる場合には、移動操作と判定する。 On the other hand, when it is determined that it is included in the vicinity of the object (in the case of “YES” in step S2-4), the control unit 11 of the user terminal 10 executes a determination process as to whether it is a moving operation (step S2-7). ). Specifically, when the touch position is included in the moving operation area 330, the touch control unit 112 of the control unit 11 determines that the touch operation is a moving operation.
移動操作と判定した場合（ステップＳ２−７において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、スライド軌跡に応じてオブジェクトの移動処理を実行する（ステッ
プＳ２−８）。具体的には、制御部１１の描画処理部１１４は、スライド軌跡に応じて、オブジェクト３００を移動する。そして、描画処理部１１４は、スライド操作のタッチオフ時に、オブジェクト３００の配置を決定し、ＳＮＳ処理部１１５は、このオブジェクトを含む画像を用いて、ソーシャルネットワークサービスを利用する。
When it is determined that the operation is a moving operation (in the case of “YES” in step S2-7), the control unit 11 of the user terminal 10 executes the moving process of the object according to the slide trajectory (step S2-8). Specifically, the drawing processing unit 114 of the control unit 11 moves the object 300 according to the slide trajectory. Then, the drawing processing unit 114 determines the arrangement of the object 300 when the slide operation is touched off, and the SNS processing unit 115 uses the image including the object to use the social network service.
図１０に示すように、移動操作と判定した場合、スライド軌跡４１０に応じて、オブジェクト３００を移動する。
一方、タッチ位置が、変形操作エリア３１１〜３１４，３２１〜３２４に含まれる場合には、変形操作と判定する。変形操作と判定した場合（ステップＳ２−７において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、スライド軌跡に応じてオブジェクトの変形処理を実行する（ステップＳ２−９）。具体的には、制御部１１の描画処理部１１４は、変形操作エリア３１１〜３１４，３２１〜３２４に応じて、オブジェクト３００を変形する。そして、描画処理部１１４は、スライド操作のタッチオフ時に、オブジェクト３００の形状を決定し、ＳＮＳ処理部１１５は、このオブジェクトを含む画像を用いて、ソーシャルネットワークサービスを利用する。
As shown in FIG. 10, when it is determined to be a moving operation, the object 300 is moved according to the slide trajectory 410.
On the other hand, when the touch position is included in the deformation operation areas 311 to 314 and 321 to 324, it is determined that the deformation operation is performed. When it is determined to be a deforming operation (in the case of “NO” in step S2-7), the control unit 11 of the user terminal 10 executes the object deforming process according to the slide trajectory (step S2-9). Specifically, the drawing processing unit 114 of the control unit 11 deforms the object 300 according to the deformation operation areas 311 to 314 and 321 to 324. Then, the drawing processing unit 114 determines the shape of the object 300 when the slide operation is touched off, and the SNS processing unit 115 uses the image including the object to use the social network service.
図１１に示すように、変形操作エリア３２１のタッチを検知した場合、オブジェクト３００の右辺を左右に移動させて、オブジェクト３００を変形したオブジェクト４２０を生成する。
また、図１２に示すように、変形操作エリア３１２のタッチを検知した場合、オブジェクト３００の頂点３０２を移動させて、オブジェクト３００を変形したオブジェクト４３０を生成する。
As shown in FIG. 11, when a touch on the transformation operation area 321 is detected, the right side of the object 300 is moved to the left or right to generate an object 420 obtained by transforming the object 300.
Further, as shown in FIG. 12, when a touch on the transformation operation area 312 is detected, the vertex 302 of the object 300 is moved to generate an object 430 obtained by transforming the object 300.
以上、本実施形態によれば、以下に示す効果を得ることができる。
（２）上記実施形態では、オブジェクト３００に対して、変形操作エリア３１１〜３１４，３２１〜３２４を設ける。タッチ操作により、図形を変形する場合、頂点や線分のような狭い領域を、指により的確に選択することができない場合がある。これに対して、頂点や線分の周囲に配置された操作エリアにより、効率的かつ的確に変形を行なうことができる。
As described above, according to this embodiment, the following effects can be obtained.
(2) In the above embodiment, the transformation operation areas 311 to 314 and 321 to 324 are provided for the object 300. When deforming a figure by a touch operation, it may not be possible to accurately select a narrow area such as a vertex or a line segment with a finger. On the other hand, the operation areas arranged around the vertices and the line segments enable efficient and appropriate deformation.
（３）上記実施形態では、変形操作エリア３１１〜３１４，３２１〜３２４の外側領域においても、オブジェクト３００に対する操作を行なう操作エリアを設ける。オブジェクト周辺内に含まれないと判定した場合（ステップＳ２−４において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、スライド軌跡の回転角の算出処理（ステップＳ２−５）、回転角に応じてオブジェクトの回転処理（ステップＳ２−６）を実行する。これにより、オブジェクトから離れた位置でのスライド操作により、オブジェクトの状況を確認しながら、配置を変更することができる。 (3) In the above embodiment, an operation area for performing an operation on the object 300 is provided even in the outer area of the deformation operation areas 311 to 314 and 321 to 324. When it is determined that the object is not included in the vicinity of the object (“NO” in step S2-4), the control unit 11 of the user terminal 10 calculates the rotation angle of the slide trajectory (step S2-5), the rotation angle. The object rotation processing (step S2-6) is executed according to the above. This allows the arrangement to be changed while confirming the status of the object by a slide operation at a position away from the object.
（第３の実施形態）
次に、図１３を用いて、第３の実施形態を説明する。第１の実施形態においては、線画を作成する場合、第２の実施形態においては、図形を作成する場合を説明した。この場合、ツール画面において、例えばカラーパレット等を用いて配色を決定する。第３の実施形態は、描画エリアに表示されたオブジェクトの属性（ここでは配色）を用いて、線画や図形の配色を決定する構成であり、同様の部分については詳細な説明を省略する。
(Third Embodiment)
Next, a third embodiment will be described with reference to FIG. The case where a line drawing is created in the first embodiment and the case where a graphic is created are described in the second embodiment. In this case, the color scheme is determined on the tool screen using, for example, a color palette. The third embodiment is configured to determine the color arrangement of a line drawing or a figure by using the attributes (color arrangement here) of the objects displayed in the drawing area, and detailed description of similar portions will be omitted.
（配色決定処理）
図１３を用いて、配色決定処理を説明する。
まず、ユーザ端末１０の制御部１１は、長押し検知処理を実行する（ステップＳ３−１）。具体的には、画面上に表示されている任意の色の箇所から色を吸い取り、配色を決定するスポイト機能を起動させる場合には、描画エリア２２０上で、タッチを継続する長押
し操作を行なう。この場合、制御部１１のタッチ制御部１１２は、同じ位置でのタッチ継続時間を計測し、長押し基準時間を経過した場合には、長押し操作と判定する。
(Color scheme determination process)
The color arrangement determination process will be described with reference to FIG.
First, the control unit 11 of the user terminal 10 executes a long press detection process (step S3-1). Specifically, when a color is absorbed from an arbitrary color portion displayed on the screen and the eyedropper function for determining the color arrangement is activated, a long press operation for continuing the touch is performed on the drawing area 220. . In this case, the touch control unit 112 of the control unit 11 measures the touch duration time at the same position, and when the long press reference time has elapsed, determines that it is a long press operation.
次に、ユーザ端末１０の制御部１１は、ポインタ位置の色抽出処理を実行する（ステップＳ３−２）。具体的には、制御部１１の描画処理部１１４は、長押し操作が行なわれた位置にポインタを配置する。そして、描画処理部１１４は、ポインタが配置された位置の配色を抽出する。更に、描画処理部１１４は、ツール画面の配色の選択画面（属性表示領域）に、描画エリアから抽出した配色を表示する。ここで、タッチパネルディスプレイ１４にタッチした状態でポインタ位置（タッチ位置）スライド操作を行なった場合、描画処理部１１４は、ポインタ位置の色抽出処理（ステップＳ３−２）を継続する。 Next, the control unit 11 of the user terminal 10 executes the color extraction processing of the pointer position (step S3-2). Specifically, the drawing processing unit 114 of the control unit 11 arranges the pointer at the position where the long press operation is performed. Then, the drawing processing unit 114 extracts the color arrangement at the position where the pointer is arranged. Further, the drawing processing unit 114 displays the color arrangement extracted from the drawing area on the color arrangement selection screen (attribute display area) of the tool screen. Here, when the pointer position (touch position) slide operation is performed with the touch panel display 14 being touched, the drawing processing unit 114 continues the pointer position color extraction process (step S3-2).
次に、ユーザ端末１０の制御部１１は、タッチオフかどうかについての判定処理を実行する（ステップＳ３−３）。具体的には、制御部１１のタッチ制御部１１２は、タッチパネルディスプレイ１４におけるタッチ位置のスライドに追従しながら、タッチの離脱（タッチオフ）を待機する。 Next, the control unit 11 of the user terminal 10 executes a determination process as to whether or not the touch is off (step S3-3). Specifically, the touch control unit 112 of the control unit 11 waits for a touch release (touch-off) while following the slide of the touch position on the touch panel display 14.
タッチオフでないと判定した場合（ステップＳ３−３において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、ポインタ位置の色抽出処理（ステップＳ３−２）を継続する。
タッチオフと判定した場合（ステップＳ３−３において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、配色の設定処理を実行する（ステップＳ３−４）。具体的には、制御部１１の描画処理部１１４は、タッチオフ時のポインタ位置の配色をツール画面に設定する。これにより、この配色を用いての線画や図形の配置を行なうことができる。
When it is determined that the touch-off is not performed (“NO” in step S3-3), the control unit 11 of the user terminal 10 continues the pointer position color extraction processing (step S3-2).
When the touch-off is determined (“YES” in step S3-3), the control unit 11 of the user terminal 10 executes the color arrangement setting process (step S3-4). Specifically, the drawing processing unit 114 of the control unit 11 sets the color arrangement of the pointer position at the time of touch-off on the tool screen. As a result, line drawings and figures can be arranged using this color scheme.
以上、本実施形態によれば、以下に示す効果を得ることができる。
（４）上記実施形態では、ユーザ端末１０の制御部１１は、長押し検知処理（ステップＳ３−１）、ポインタ位置の色抽出処理（ステップＳ３−２）を実行する。タッチオフと判定した場合（ステップＳ３−３において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、配色の設定処理を実行する（ステップＳ３−４）。これにより、タッチ位置とは異なるツール画面において、配色を確認しながら、所望の配色を選択することができる。
As described above, according to this embodiment, the following effects can be obtained.
(4) In the above embodiment, the control unit 11 of the user terminal 10 executes the long press detection process (step S3-1) and the pointer position color extraction process (step S3-2). When the touch-off is determined (“YES” in step S3-3), the control unit 11 of the user terminal 10 executes the color arrangement setting process (step S3-4). As a result, it is possible to select a desired color arrangement while checking the color arrangement on the tool screen different from the touch position.
（第４の実施形態）
次に、図１４を用いて、第４の実施形態を説明する。第３の実施形態においては、ポインタ位置の配色を抽出して、描画に利用する場合を説明した。第４の実施形態は、配色候補を出力する構成であり、同様の部分については詳細な説明を省略する。この場合、描画処理部１１４は、使用された配色の操作履歴やユーザによって指定された配色を、配色候補として記憶する。
(Fourth Embodiment)
Next, a fourth embodiment will be described with reference to FIG. In the third embodiment, the case where the color arrangement at the pointer position is extracted and used for drawing has been described. The fourth embodiment is configured to output color arrangement candidates, and detailed description of similar parts will be omitted. In this case, the drawing processing unit 114 stores the operation history of the used color arrangement and the color arrangement specified by the user as the color arrangement candidates.
（配色決定処理）
図１４を用いて、配色決定処理を説明する。
まず、ユーザ端末１０の制御部１１は、ステップＳ３−１と同様に、長押し検知処理を実行する（ステップＳ４−１）。
(Color scheme determination process)
The color arrangement determination process will be described with reference to FIG.
First, the control unit 11 of the user terminal 10 executes the long press detection process as in step S3-1 (step S4-1).
この場合、更に、ユーザ端末１０の制御部１１は、配色候補の出力処理を実行する。具体的には、制御部１１の描画処理部１１４は、ポインタの周囲に配色候補を出力する。例えば、ポインタの上下左右の十字方向に、異なる配色の候補を出力する。配色候補としては、記憶した使用履歴やユーザ指定の配色を用いることができる。なお、配色候補の出力位置は、長押し操作位置の周囲であれば、十字方向に限定されるものではない。 In this case, the control unit 11 of the user terminal 10 further executes an output process of the color arrangement candidate. Specifically, the drawing processing unit 114 of the control unit 11 outputs color arrangement candidates around the pointer. For example, different color arrangement candidates are output in the left, right, top, and bottom cross directions. As the color arrangement candidate, the stored usage history or the color arrangement specified by the user can be used. The output position of the color arrangement candidate is not limited to the cross direction as long as it is around the long press operation position.
次に、ユーザ端末１０の制御部１１は、フリックかどうかについての判定処理を実行す
る（ステップＳ４−２）。具体的には、制御部１１のタッチ制御部１１２は、タッチした指を素早く動かしたり弾いたりする操作を検知した場合、フリック操作と判定する。
Next, the control unit 11 of the user terminal 10 executes a determination process as to whether or not it is a flick (step S4-2). Specifically, when the touch control unit 112 of the control unit 11 detects an operation of quickly moving or flipping the touched finger, the touch control unit 112 determines that the operation is a flick operation.
フリックと判定した場合（ステップＳ４−２において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、フリック方向に応じて配色の特定処理を実行する（ステップＳ４−３）。具体的には、制御部１１の描画処理部１１４は、フリック方向に設定された配色候補を、描画に用いる配色として特定する。 When it is determined to be a flick (in the case of "YES" in step S4-2), the control unit 11 of the user terminal 10 executes the color arrangement specifying process according to the flick direction (step S4-3). Specifically, the drawing processing unit 114 of the control unit 11 identifies the color arrangement candidate set in the flick direction as the color arrangement used for drawing.
一方、フリックでないと判定した場合（ステップＳ４−２において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、ステップＳ３−２〜Ｓ３−４と同様に、ポインタ位置の色抽出処理（ステップＳ４−４）、タッチオフかどうかについての判定処理（ステップＳ４−５）、配色の設定処理（ステップＳ４−６）を実行する。 On the other hand, when it is determined that it is not a flick (in the case of “NO” in step S4-2), the control unit 11 of the user terminal 10 performs the color extraction process of the pointer position (step S3-2 to S3-4) as in step S3-2 to S3-4. S4-4), determination processing as to whether touch-off or not (step S4-5), and color arrangement setting processing (step S4-6) are executed.
以上、本実施形態によれば、上記（４）の効果に加えて、以下に示す効果を得ることができる。
（５）上記実施形態では、ユーザ端末１０の制御部１１は、配色候補の出力処理を実行する。そして、フリックと判定した場合（ステップＳ４−２において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、フリック方向に応じて配色の特定処理を実行する（ステップＳ４−３）。これにより、配色候補により、効率的に配色を選択することができる。
As described above, according to this embodiment, the following effect can be obtained in addition to the effect (4).
(5) In the above embodiment, the control unit 11 of the user terminal 10 executes the output process of the color arrangement candidate. Then, when it is determined to be a flick (in the case of “YES” in step S4-2), the control unit 11 of the user terminal 10 executes the color arrangement specifying process according to the flick direction (step S4-3). As a result, the color arrangement can be efficiently selected according to the color arrangement candidates.
（第５の実施形態）
次に、図１５を用いて、第５の実施形態を説明する。第２の実施形態においては、図形オブジェクトを配置して、移動や変形を行なう場合を説明した。第５の実施形態は、図形オブジェクトの配置時に変形する構成であり、同様の部分については詳細な説明を省略する。この場合、描画に用いることができる図形オブジェクトには、始点と終点とを設定しておく。
(Fifth Embodiment)
Next, a fifth embodiment will be described with reference to FIG. In the second embodiment, the case where graphic objects are arranged and moved or deformed has been described. The fifth embodiment is configured to be deformed when a graphic object is arranged, and detailed description of similar parts will be omitted. In this case, a start point and an end point are set in advance for the graphic object that can be used for drawing.
（図形生成処理）
図１５を用いて、図形生成処理を説明する。
まず、ユーザ端末１０の制御部１１は、ステップＳ２−１と同様に、オブジェクト選択処理を実行する（ステップＳ５−１）。
(Figure generation processing)
The graphic generation process will be described with reference to FIG.
First, the control unit 11 of the user terminal 10 executes the object selection process, similarly to step S2-1 (step S5-1).
次に、ユーザ端末１０の制御部１１は、最初のタップ位置に始点設定処理を実行する（ステップＳ５−２）。具体的には、選択したオブジェクトの描画を行なう場合、描画エリア２２０において、オブジェクトの描画開始位置をタップする。この場合、制御部１１のタッチ制御部１１２は、描画エリア２２０において、タッチされたタップ位置（座標）を特定する。そして、描画処理部１１４は、このタップ位置に、オブジェクトの描画開始位置（始点）を設定する。 Next, the control unit 11 of the user terminal 10 executes start point setting processing at the first tap position (step S5-2). Specifically, when drawing the selected object, the drawing start position of the object is tapped in the drawing area 220. In this case, the touch control unit 112 of the control unit 11 specifies the tap position (coordinates) touched in the drawing area 220. Then, the drawing processing unit 114 sets the drawing start position (start point) of the object at this tap position.
次に、ユーザ端末１０の制御部１１は、２回目のタッチの検知処理を実行する（ステップＳ５−３）。具体的には、オブジェクトの終点位置を決定する場合には、再度、描画エリア２２０をタッチする。この場合、制御部１１のタッチ制御部１１２は、描画エリア２２０において、タッチ位置（座標）を特定する。 Next, the control unit 11 of the user terminal 10 executes a second touch detection process (step S5-3). Specifically, when the end point position of the object is determined, the drawing area 220 is touched again. In this case, the touch control unit 112 of the control unit 11 specifies the touch position (coordinates) in the drawing area 220.
次に、ユーザ端末１０の制御部１１は、タッチ位置に終点設定処理を実行する（ステップＳ５−４）。具体的には、制御部１１の描画処理部１１４は、このタッチ位置に、オブジェクトの描画終点位置を設定する。 Next, the control unit 11 of the user terminal 10 executes the end point setting process at the touch position (step S5-4). Specifically, the drawing processing unit 114 of the control unit 11 sets the drawing end point position of the object at this touch position.
次に、ユーザ端末１０の制御部１１は、始点、終点でオブジェクトの変形処理を実行す
る（ステップＳ５−５）。具体的には、制御部１１の描画処理部１１４は、描画開始位置、描画終点位置に、オブジェクトの始点、終点を設定し、描画エリア２２０にオブジェクトを表示する。
Next, the control unit 11 of the user terminal 10 executes the deformation process of the object at the start point and the end point (step S5-5). Specifically, the drawing processing unit 114 of the control unit 11 sets the starting point and the ending point of the object at the drawing start position and the drawing end point position, and displays the object in the drawing area 220.
次に、ユーザ端末１０の制御部１１は、タッチオフかどうかについての判定処理を実行する（ステップＳ５−６）。具体的には、オブジェクトを変形させる場合、タッチ位置をスライドさせる。この場合、制御部１１の描画処理部１１４は、スライド操作に応じて、オブジェクトの終点を追従させて、図形を変形する。そして、描画処理部１１４は、タッチパネルディスプレイ１４からタッチの離脱（タッチオフ）を待機する。 Next, the control unit 11 of the user terminal 10 executes a determination process as to whether or not the touch is off (step S5-6). Specifically, when the object is deformed, the touch position is slid. In this case, the drawing processing unit 114 of the control unit 11 deforms the figure by causing the end point of the object to follow in accordance with the slide operation. Then, the drawing processing unit 114 waits for a touch release (touch-off) from the touch panel display 14.
タッチオフでないと判定した場合（ステップＳ５−６において「ＮＯ」の場合）、ユーザ端末１０の制御部１１は、始点、終点でオブジェクトの変形処理（ステップＳ５−５）を継続する。 When it is determined that the touch-off is not performed (“NO” in step S5-6), the control unit 11 of the user terminal 10 continues the object transformation process (step S5-5) at the start point and the end point.
一方、タッチオフと判定した場合（ステップＳ１−４において「ＹＥＳ」の場合）、ユーザ端末１０の制御部１１は、オブジェクトの設定処理を実行する（ステップＳ５−７）。具体的には、制御部１１の描画処理部１１４は、タッチオフ位置を終点とするオブジェクトを生成し、ＳＮＳ処理部１１５は、このオブジェクトを含む画像を用いて、ソーシャルネットワークサービスを利用する。 On the other hand, when it is determined that the touch is off (“YES” in step S1-4), the control unit 11 of the user terminal 10 executes object setting processing (step S5-7). Specifically, the drawing processing unit 114 of the control unit 11 generates an object whose end point is the touch-off position, and the SNS processing unit 115 uses the image including this object to use the social network service.
以上、本実施形態によれば、以下に示す効果を得ることができる。
（６）上記実施形態では、ユーザ端末１０の制御部１１は、最初のタップ位置に始点設定処理（ステップＳ５−２）、タッチ位置に終点設定処理（ステップＳ５−４）、始点、終点でオブジェクトの変形処理（ステップＳ５−５）を実行する。これにより、始点及び終点の設定やスライド操作によって、オブジェクトの形状や配置を決定することができる。
As described above, according to this embodiment, the following effects can be obtained.
(6) In the above embodiment, the control unit 11 of the user terminal 10 sets the start point setting process at the first tap position (step S5-2), the end point setting process at the touch position (step S5-4), and the object at the start point and the end point. The modification process (step S5-5) is executed. Thus, the shape and arrangement of the object can be determined by setting the start point and the end point and performing the slide operation.
なお、上記実施形態は、以下の態様に変更してもよい。
・上記第１の実施形態では、ユーザ端末１０の制御部１１は、描画ツールの指定処理を実行する（ステップＳ１−１）。ここでは、ツールメニュー２１０において、描画ボタン２１１を選択する。これに代えて、消しゴムボタン２１２が選択された場合に、ポインターモード処理を実行するようにしてもよい。この場合には、描画処理部１１４は、ツール画面で消しゴムツールの大きさを指定する。そして、背景色による線画を描くことにより、図形の一部を消去する。この場合も、ユーザ端末１０の制御部１１は、描画開始位置の設定処理（ステップＳ１−２）において消去開始位置を設定し、操作開始位置の設定処理（ステップＳ１−３）、スライド軌跡に応じた描画処理（ステップＳ１−５）により、軌跡に応じた消去を行なう。
The above embodiment may be modified into the following modes.
-In the said 1st Embodiment, the control part 11 of the user terminal 10 performs the designation | designated process of a drawing tool (step S1-1). Here, the drawing button 211 is selected in the tool menu 210. Alternatively, the pointer mode process may be executed when the eraser button 212 is selected. In this case, the drawing processing unit 114 specifies the size of the eraser tool on the tool screen. Then, a part of the figure is erased by drawing a line drawing in the background color. Also in this case, the control unit 11 of the user terminal 10 sets the erasing start position in the drawing start position setting process (step S1-2), and responds to the operation start position setting process (step S1-3) and the slide trajectory. By the drawing process (step S1-5), erasing according to the locus is performed.
・上記第１の実施形態では、操作開始位置の座標から描画開始位置の座標への補正ベクトル（ｘ３，ｙ３）を算出する。ここで、補正ベクトルの決定方法は、これに限定されるものではない。例えば、予め定めた初期設定の補正ベクトル（ｘ４，ｙ４）を用いてもよい。この場合、操作開始位置に対して、初期設定の補正ベクトルを用いて描画開始位置を決定する。すなわち、操作開始位置の設定処理（ステップＳ１−３）に応じて、描画開始位置の設定処理（ステップＳ１−２）を実行する。なお、初期設定の補正ベクトルの要素は、同じ値（ｘ４＝ｙ４）に設定したり、異なる値（ｘ４≠ｙ４）に設定したりしてもよい。
また、補正ベクトルを、ユーザの入力や、操作環境に応じて変更するようにしてもよい。具体的には、制御部１１が、ユーザのタッチ位置の面積（指の広さ、スタイラスの広さ）を判定し、その値に応じて、補正ベクトルを変更する。例えば、タッチ位置の面積が広い場合には、補正ベクトルを大きくする。これにより、ユーザの入力に応じた快適な描画
が可能となる。
また、ユーザの書き直し、修正操作等に応じて、補正ベクトルを変更してもよい。ユーザのミス入力が多いと考えられる場合、ユーザの修正結果に応じて、補正ベクトルを変更する。この場合、描画開始位置に対して、操作開始位置を変更できるようにしておく。そして、例えば、描画開始位置に対して「最初の入力した操作開始位置」よりも「修正の際の操作開始位置」を遠くに変更する操作が行われた操作履歴を記録する。そして、このような変更回数が所定回数を超えた場合、補正ベクトルを大きくするように変更してもよい。これにより、ユーザ毎の描画特性に応じた描画が可能となる。
また、描画エリア２２０の広さや、描画に用いる対象（ペンの太さ）や、描画対象の大きさ（狭い領域か、広い領域か）に応じて、補正ベクトルを変更してもよい。これにより、より快適な描画環境の提供と、柔軟な入力が可能になる。
In the first embodiment, the correction vector (x3, y3) from the coordinate of the operation start position to the coordinate of the drawing start position is calculated. Here, the method of determining the correction vector is not limited to this. For example, a preset default correction vector (x4, y4) may be used. In this case, with respect to the operation start position, the drawing start position is determined using the default correction vector. That is, the drawing start position setting process (step S1-2) is executed according to the operation start position setting process (step S1-3). The elements of the initial correction vector may be set to the same value (x4 = y4) or different values (x4 ≠ y4).
Further, the correction vector may be changed according to the user's input or the operating environment. Specifically, the control unit 11 determines the area of the user's touch position (width of finger, width of stylus), and changes the correction vector according to the value. For example, when the area of the touch position is large, the correction vector is increased. As a result, comfortable drawing according to the user's input becomes possible.
Further, the correction vector may be changed in accordance with the user's rewriting or correction operation. When it is considered that there are many mistake inputs by the user, the correction vector is changed according to the correction result of the user. In this case, the operation start position can be changed with respect to the drawing start position. Then, for example, the operation history in which the operation of changing the “operation start position for correction” farther than the “first input operation start position” with respect to the drawing start position is recorded. Then, when the number of such changes exceeds a predetermined number, the correction vector may be changed to be large. This enables drawing according to the drawing characteristics of each user.
The correction vector may be changed according to the size of the drawing area 220, the object used for drawing (the thickness of the pen), and the size of the drawing object (narrow area or wide area). This enables a more comfortable drawing environment and flexible input.
・上記第２の実施形態では、ユーザ端末１０の制御部１１は、タッチ位置の特定処理を実行する（ステップＳ２−３）。そして、ユーザ端末１０の制御部１１は、オブジェクト周辺内かどうかについての判定処理（ステップＳ２−４）、移動操作かどうかについての判定処理（ステップＳ２−７）を実行する。これに代えて、ポインターモード処理と同様に、最初のタップで操作（変形、移動、回転）を決定し、２回目のタッチによるスライド操作により、スライド軌跡に応じた変形量、移動量、回転角を決定するようにしてもよい。これにより、操作時の指が邪魔にならず、オブジェクトを設定することができる。 -In the said 2nd Embodiment, the control part 11 of the user terminal 10 performs the process of pinpointing a touch position (step S2-3). Then, the control unit 11 of the user terminal 10 executes a determination process (step S2-4) as to whether or not the object is in the vicinity of the object and a determination process (step S2-7) as to whether or not the operation is a moving operation. Instead of this, similarly to the pointer mode processing, the operation (deformation, movement, rotation) is determined by the first tap, and the deformation amount, movement amount, rotation angle according to the slide trajectory is determined by the slide operation by the second touch. May be determined. As a result, the finger can be set without disturbing the finger during operation.
・上記第３、第４の実施形態では、描画エリアを用いて、線画や図形の配色を決定する。ここで、スポイト機能により取り込む属性は配色に限定されるものではない。例えば、模様等のような視覚的な属性のみならず、オブジェクトに割り当てられた名称等の属性を取り込むようにしてもよい。 In the third and fourth embodiments, the drawing area is used to determine the color arrangement of the line drawing and the graphic. Here, the attribute to be captured by the dropper function is not limited to the color scheme. For example, not only visual attributes such as patterns, but also attributes such as names assigned to objects may be fetched.
・上記第１の実施形態では、ユーザ端末１０の制御部１１は、描画開始位置の設定処理を実行する（ステップＳ１−２）。ここでは、タッチパネルディスプレイ１４上でタップを行なう。また、上記第３の実施形態では、ユーザ端末１０の制御部１１は、長押し検知処理を実行する（ステップＳ３−１）。上記第５の実施形態では、最初のタップ位置に始点設定処理（ステップＳ５−２）、２回目のタッチの検知処理（ステップＳ５−３）を実行する。これらの各機能を起動する操作は、他の操作と識別できるものであれば、操作方法は限定されるものではない。例えば、第５の実施形態では、タッチ位置〜タッチオフ位置により始点設定、終点設定を行なうようにしてもよい。 -In the said 1st Embodiment, the control part 11 of the user terminal 10 performs the setting process of the drawing start position (step S1-2). Here, a tap is performed on the touch panel display 14. Moreover, in the said 3rd Embodiment, the control part 11 of the user terminal 10 performs a long press detection process (step S3-1). In the fifth embodiment, the start point setting process (step S5-2) and the second touch detection process (step S5-3) are executed at the first tap position. The operation method for activating each of these functions is not limited as long as it can be distinguished from other operations. For example, in the fifth embodiment, the start point setting and the end point setting may be performed depending on the touch position to the touch off position.
・上記各実施形態では、描画したオブジェクトを含む画像を、ソーシャルネットワークサービスに利用する。描画の適用対象は、ソーシャルネットワークサービスに限定されるものではなく、線画や図形を利用するアプリケーション（ゲーム等）に用いることが可能である。
・上記各実施形態では、一つのアプリケーションプログラムを起動させることにより、制御部１１を、描画処理部１１４、ＳＮＳ処理部１１５として機能させる。ここで、描画処理部１１４とＳＮＳ処理部１１５とは、別のアプリケーションプログラムにより機能させるようにしてもよい。具体的には、描画処理プログラムにより、描画処理部１１４を起動し、描画処理部１１４により生成されたオブジェクトを、他のアプリケーションプログラムの機能に提供するようにしてもよい。
-In each said embodiment, the image containing the drawn object is utilized for a social network service. The drawing application target is not limited to the social network service, and can be used for an application (game or the like) that uses a line drawing or a figure.
In each of the above-described embodiments, the control unit 11 is caused to function as the drawing processing unit 114 and the SNS processing unit 115 by activating one application program. Here, the drawing processing unit 114 and the SNS processing unit 115 may be made to function by different application programs. Specifically, the drawing processing program may activate the drawing processing unit 114 and provide the object generated by the drawing processing unit 114 to the function of another application program.
・上記各実施形態では、サーバ装置が生成したデータに基づいて、ユーザ端末に表示させるウェブ表示を行なう。ここで、描画を行なうための画面の少なくとも一部（例えば、ツールメニュー２１０や描画エリア２２０）を、ユーザ端末にインストールされているネイティブアプリケーションによって表示させるネイティブ表示としてもよい。また、ユーザ端末１０及びサーバ装置のそれぞれが処理の一部を担うハイブリッドアプリケーション
とすることもできる。
次に、上記実施形態及び別例から把握できる技術的思想について、以下に追記する。
〔１〕
制御部と入力操作が可能な表示部とを備えた情報処理装置を制御するプログラムであって、
前記制御部に、
前記表示部での入力位置に応じた第１座標を取得し、
前記第１座標に位置する第１オブジェクトを特定し、
前記第１座標を特定するための入力操作が解除された後に入力された第２座標からの軌跡に応じて前記第１オブジェクトから描画された第２オブジェクトを生成すること、を実行させることを特徴とする制御プログラム。
〔２〕
前記表示部に表示されたオブジェクトの操作を検知した場合、前記第１座標に対応する第１オブジェクトを特定し、
前記第１座標を特定するための入力操作が解除された後に入力された第２座標からの軌跡に応じて前記第１オブジェクトの操作を行うことを、前記制御部に実行させる〔１〕に記載の制御プログラム。
〔３〕
前記表示部に表示されたオブジェクトの消去指示を検知した場合、前記表示部での入力位置に応じた第１座標を取得し、
前記第１座標を特定するための入力操作が解除された後に入力された第２座標からの軌跡に応じて前記第１座標から前記オブジェクトの消去を行なうことを、前記制御部に実行させる〔１〕又は〔２〕に記載の制御プログラム。
〔４〕
前記表示部に表示されたオブジェクトの選択を検知した場合、オブジェクトの配置位置を特定し、
前記第１座標を特定するための入力操作が解除された後に入力された第２座標からの軌跡に応じて、前記オブジェクトの配置を決定することを、前記制御部に実行させる〔１〕〜〔３〕のいずれか１つに記載の制御プログラム。
〔５〕
前記オブジェクトの配置に対して、複数の操作エリアが設定されており、各操作エリアの選択に応じて、前記オブジェクトに対して異なる操作を実行することを、前記制御部に実行させる〔４〕に記載の制御プログラム。
〔６〕
前記オブジェクト内の基準位置に対して、前記第２座標からの軌跡の広がり角度を算出し、前記広がり角度に基づいて、前記オブジェクトの回転操作を実行することを、前記制御部に実行させる〔４〕又は〔５〕に記載の制御プログラム。
〔７〕
前記表示部において操作された操作位置のオブジェクトの属性を特定し、属性表示領域に表示し、
操作オフの検知時に、前記属性を描画時の属性として設定することを、前記制御部に実行させる〔１〕〜〔６〕の何れか一項に記載の制御プログラム。
〔８〕
前記操作位置の周囲に属性候補を出力し、
操作オフの方向に応じて、前記属性候補の中から描画時に用いる属性を決定することを、前記制御部に実行させる７に記載の制御プログラム。
〔９〕
始点と終点とが設定されたオブジェクトが選択された場合、
前記表示部の操作位置に前記始点を設定し、
スライド操作された操作位置に前記終点を設定して、前記オブジェクトを前記表示部に
出力し、
操作オフ時に前記オブジェクトの形状を決定することを、前記制御部に実行させる〔１〕〜〔８〕の何れか一項に記載の制御プログラム。
〔１０〕
前記第１座標及び前記第２座標に基づき、前記第２座標からの軌跡を前記第２オブジェクトに補正するための補正ベクトルを算出し、
前記補正ベクトルを、前記入力位置の面積に応じて変更することを、前記制御部に実行させる〔１〕〜〔９〕のいずれか１項に記載の制御プログラム。
〔１１〕
前記第１座標及び前記第２座標に基づき、前記第２座標からの軌跡を前記第２オブジェクトに補正するための補正ベクトルを算出し、
前記補正ベクトルを、前記第２座標からの軌跡の修正履歴に基づき変更することを、前記制御部に実行させる〔１〕〜〔１０〕のいずれか１項に記載の制御プログラム。
〔１２〕
制御部と入力操作が可能な表示部とを備えた情報処理装置を制御する制御方法であって、
前記制御部が、
前記表示部での入力位置に応じた第１座標を取得し、
前記第１座標に位置する第１オブジェクトを特定し、
前記第１座標を特定するための入力操作が解除された後に入力された第２座標からの軌跡に応じて前記第１オブジェクトから描画された第２オブジェクトを生成することを特徴とする制御方法。
〔１３〕
制御部と入力操作が可能な表示部とを備えた情報処理装置であって、
前記制御部が、
前記表示部での入力位置に応じた第１座標を取得し、
前記第１座標に位置する第１オブジェクトを特定し、
前記第１座標を特定するための入力操作が解除された後に入力された第２座標からの軌跡に応じて前記第１オブジェクトから描画された第２オブジェクトを生成することを特徴とする情報処理装置。
In each of the above-described embodiments, the web display to be displayed on the user terminal is performed based on the data generated by the server device. Here, at least part of the screen for drawing (for example, the tool menu 210 or the drawing area 220) may be a native display that is displayed by a native application installed in the user terminal. Alternatively, each of the user terminal 10 and the server device may be a hybrid application that performs a part of the processing.
Next, technical ideas that can be understood from the above-described embodiment and other examples will be added below.
[1]
A program for controlling an information processing device including a control unit and a display unit capable of input operation,
In the control unit,
Obtaining the first coordinate according to the input position on the display unit,
Identifying a first object located at the first coordinate,
Generating a second object drawn from the first object according to a locus from the second coordinate input after the input operation for specifying the first coordinate is released. And control program.
[2]
When the operation of the object displayed on the display unit is detected, the first object corresponding to the first coordinate is specified,
[1] causing the control unit to perform an operation of the first object according to a locus from the second coordinate that is input after the input operation for specifying the first coordinate is canceled Control program.
[3]
When the deletion instruction of the object displayed on the display unit is detected, the first coordinate corresponding to the input position on the display unit is acquired,
The control unit is caused to execute the deletion of the object from the first coordinate according to the locus from the second coordinate that is input after the input operation for specifying the first coordinate is canceled [1 ] Or the control program as described in [2].
[4]
When the selection of the object displayed on the display unit is detected, the placement position of the object is specified,
[1] to [[1] to [1] to [1] to [1] to [1] to determine the placement of the object according to the locus from the second coordinate that is input after the input operation for specifying the first coordinate is canceled. 3] The control program according to any one of [3].
[5]
A plurality of operation areas are set for the arrangement of the objects, and the control unit is made to execute different operations on the objects according to the selection of each operation area. The described control program.
[6]
The control unit is caused to calculate a spread angle of a trajectory from the second coordinates with respect to a reference position in the object, and execute a rotation operation of the object based on the spread angle [4. ] Or the control program as described in [5].
[7]
The attribute of the object at the operation position operated on the display unit is specified and displayed in the attribute display area,
The control program according to any one of [1] to [6], which causes the control unit to execute setting of the attribute as an attribute at the time of detection of operation off.
[8]
Output the attribute candidates around the operation position,
8. The control program according to 7, which causes the control unit to determine an attribute to be used at the time of drawing from the attribute candidates in accordance with the direction of operation OFF.
[9]
If an object with start and end points is selected,
Set the start point to the operation position of the display unit,
The end point is set to the slide operated position, and the object is output to the display unit,
The control program according to any one of [1] to [8], which causes the control unit to determine the shape of the object when the operation is off.
[10]
Calculating a correction vector for correcting the trajectory from the second coordinate to the second object based on the first coordinate and the second coordinate,
The control program according to any one of [1] to [9], which causes the control unit to change the correction vector according to the area of the input position.
[11]
Calculating a correction vector for correcting the trajectory from the second coordinate to the second object based on the first coordinate and the second coordinate,
The control program according to any one of [1] to [10], which causes the control unit to change the correction vector based on a correction history of a trajectory from the second coordinates.
[12]
A control method for controlling an information processing device including a control unit and a display unit capable of input operation,
The control unit,
Obtaining the first coordinate according to the input position on the display unit,
Identifying a first object located at the first coordinate,
A control method, wherein a second object drawn from the first object is generated according to a locus from the second coordinate input after the input operation for specifying the first coordinate is released.
[13]
An information processing device comprising a control unit and a display unit capable of input operation,
The control unit,
Obtaining the first coordinate according to the input position on the display unit,
Identifying a first object located at the first coordinate,
An information processing apparatus, wherein a second object drawn from the first object is generated according to a locus from the second coordinate input after the input operation for specifying the first coordinate is released. .
１０…ユーザ端末、１１…制御部、１１１…表示制御部、１１２…タッチ制御部、１１３…アプリケーション実行部、１１４…描画処理部、１１５…ＳＮＳ処理部、１２…メモリ、１３…通信部、１４…タッチパネルディスプレイ、２４１，２４４…線画、３００，４２０，４３０…オブジェクト。 10 ... User terminal, 11 ... Control part, 111 ... Display control part, 112 ... Touch control part, 113 ... Application execution part, 114 ... Drawing processing part, 115 ... SNS processing part, 12 ... Memory, 13 ... Communication part, 14 ... touch panel display, 241, 244 ... line drawing, 300, 420, 430 ... object.
Claims (11)
前記制御部に、
消去機能の選択を受け付ける選択ステップと、
前記表示部での入力位置に応じた消去開始位置を特定する特定ステップと、
前記消去開始位置を特定するための入力操作の後に入力され、前記消去開始位置から離れた操作開始位置を始点とする軌跡に応じて前記表示部の描画領域に表示されたオブジェクトを消去する消去ステップと、を実行させる制御プログラム。 A program for controlling an information processing device including a control unit and a display unit capable of input operation,
In the control unit,
A selection step for accepting the selection of the erase function,
A specifying step of specifying an erasing start position according to an input position on the display unit,
An erasing step of erasing an object which is input after an input operation for specifying the erasing start position and which is displayed in the drawing area of the display unit according to a locus whose starting point is an operation starting position distant from the erasing start position And a control program to execute.
請求項１に記載の制御プログラム。 The control program according to claim 1, wherein in the erasing step, an object displayed on the screen of the display unit is erased by drawing a line drawing with a background color according to a locus having the operation start position as a starting point.
前記オブジェクトが特定された後に入力された位置からの軌跡に応じて前記オブジェクトの操作を行うステップと、を前記制御部に実行させる
請求項１又は２に記載の制御プログラム。 When detecting an operation of the object displayed on the display unit, a step of specifying the object according to the input position on the display unit,
The control program according to claim 1, further comprising: a step of operating the object in accordance with a trajectory from a position input after the object is specified.
前記オブジェクトの配置を決定するステップと、を前記制御部に実行させる
請求項１〜３のいずれか１項に記載の制御プログラム。 When the selection of the object displayed on the display unit is detected, a step of specifying the arrangement position of the object,
The control program according to any one of claims 1 to 3, which causes the control unit to execute the step of determining the placement of the object.
請求項１〜５のいずれか１項に記載の制御プログラム。 The control program according to claim 1, wherein the control unit is caused to execute a first reception step of receiving an operation for displaying a software keyboard for inputting text in the drawing area.
請求項１〜６のいずれか１項に記載の制御プログラム。 7. The control unit is caused to execute a second reception step of receiving an operation for displaying an image captured by a camera provided in the information processing device in the drawing area. Control program.
前記補正ベクトルを、前記入力位置の面積に応じて変更するステップとを、前記制御部に実行させる
請求項１〜７のいずれか１項に記載の制御プログラム。 Calculating a correction vector for correcting the trajectory from the operation start position,
The control program according to any one of claims 1 to 7, which causes the control unit to execute a step of changing the correction vector according to an area of the input position.
前記補正ベクトルを、前記軌跡の修正履歴に基づき変更するステップとを、前記制御部に実行させる
請求項１〜８のいずれか１項に記載の制御プログラム。 Calculating a correction vector for correcting the trajectory from the operation start position,
The control program according to claim 1, further comprising: a step of changing the correction vector based on a correction history of the trajectory.
前記制御部が、
消去機能の選択を受け付ける選択ステップと、
前記表示部での入力位置に応じた消去開始位置を特定する特定ステップと、
前記消去開始位置を特定するための入力操作の後に入力され、前記消去開始位置から離れた操作開始位置と始点とする軌跡に応じて前記表示部の画面に表示された線画や図形を消去する消去ステップと、を実行する
制御方法。 A control method for controlling an information processing device including a control unit and a display unit capable of input operation,
The control unit,
A selection step for accepting the selection of the erase function,
A specifying step of specifying an erasing start position according to an input position on the display unit,
Erasing to erase the line drawing or figure that is input after the input operation for specifying the erasing start position and is displayed on the screen of the display unit according to the operation starting position distant from the erasing starting position and the locus of the starting point. Steps and control methods for executing.
消去機能の選択を受け付ける選択部と、
前記表示部での入力位置に応じた消去開始位置を特定する特定部と、
前記消去開始位置を特定するための入力操作の後に入力され、前記消去開始位置から離れた操作開始位置を始点とする軌跡に応じて前記表示部の画面に表示された線画や図形を消去する消去制御部と、を備える
情報処理装置。 An information processing device including a display unit capable of input operation,
A selection unit that accepts the selection of the erase function,
A specifying unit that specifies an erasing start position according to the input position on the display unit;
Erasing to erase the line drawing or figure that is input after the input operation for specifying the erasing start position and is displayed on the screen of the display unit according to the locus starting from the operation starting position distant from the erasing start position An information processing device including a control unit.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| JP2020008249A JP2020061193A (en) | 2020-01-22 | 2020-01-22 | Control program, method for control, and information processor |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| JP2020008249A JP2020061193A (en) | 2020-01-22 | 2020-01-22 | Control program, method for control, and information processor |
Related Parent Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| JP2018050572A Division JP6863918B2 (en) | 2018-03-19 | 2018-03-19 | Control programs, control methods and information processing equipment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| JP2020061193A true JP2020061193A (en) | 2020-04-16 |
Family
ID=70220073
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| JP2020008249A Pending JP2020061193A (en) | 2020-01-22 | 2020-01-22 | Control program, method for control, and information processor |
Country Status (1)
| Country | Link |
|---|---|
| JP (1) | JP2020061193A (en) |
Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JPH11305933A (en) * | 1998-04-20 | 1999-11-05 | Seiko Epson Corp | Input device and input method |
| WO2010073329A1 (en) * | 2008-12-25 | 2010-07-01 | 富士通株式会社 | Computer program, input device, and input method |
| JP2010176329A (en) * | 2009-01-28 | 2010-08-12 | Sony Corp | Information processing apparatus, animation addition method, and program |
| JP2011232881A (en) * | 2010-04-26 | 2011-11-17 | Sharp Corp | Image processor, display device, image processing method, image processing program and recording medium |
| JP2012252652A (en) * | 2011-06-06 | 2012-12-20 | Panasonic Corp | Touch panel input device |
| JP2014059851A (en) * | 2012-09-19 | 2014-04-03 | Sony Computer Entertainment Inc | Image processing device, image processing method, and computer program |
| JP2016095716A (en) * | 2014-11-14 | 2016-05-26 | 株式会社コーエーテクモゲームス | Information processing apparatus, information processing method, and program |
-
2020
- 2020-01-22 JP JP2020008249A patent/JP2020061193A/en active Pending
Patent Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JPH11305933A (en) * | 1998-04-20 | 1999-11-05 | Seiko Epson Corp | Input device and input method |
| WO2010073329A1 (en) * | 2008-12-25 | 2010-07-01 | 富士通株式会社 | Computer program, input device, and input method |
| JP2010176329A (en) * | 2009-01-28 | 2010-08-12 | Sony Corp | Information processing apparatus, animation addition method, and program |
| JP2011232881A (en) * | 2010-04-26 | 2011-11-17 | Sharp Corp | Image processor, display device, image processing method, image processing program and recording medium |
| JP2012252652A (en) * | 2011-06-06 | 2012-12-20 | Panasonic Corp | Touch panel input device |
| JP2014059851A (en) * | 2012-09-19 | 2014-04-03 | Sony Computer Entertainment Inc | Image processing device, image processing method, and computer program |
| JP2016095716A (en) * | 2014-11-14 | 2016-05-26 | 株式会社コーエーテクモゲームス | Information processing apparatus, information processing method, and program |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| JP6313395B1 (en) | Drawing processing method, drawing processing program, and drawing processing apparatus | |
| CN102722334B (en) | The control method of touch screen and device | |
| KR100831721B1 (en) | Apparatus and method for displaying of mobile terminal | |
| JP5295328B2 (en) | User interface device capable of input by screen pad, input processing method and program | |
| JP4533943B2 (en) | Information processing apparatus, display control method, and program | |
| JP5520918B2 (en) | Touch panel operation method and program | |
| US9870144B2 (en) | Graph display apparatus, graph display method and storage medium | |
| KR20100041006A (en) | A user interface controlling method using three dimension multi-touch | |
| KR20100130671A (en) | Method and apparatus for providing selected area in touch interface | |
| JP2011134278A (en) | Information processing apparatus and pointing control method | |
| JP2004078693A (en) | Visual field movement operating method | |
| KR20140038568A (en) | Multi-touch uses, gestures, and implementation | |
| JP5508269B2 (en) | System and method for manipulating digital images on a computer display | |
| KR20140030379A (en) | Method for providing guide in terminal and terminal thereof | |
| JP2014241030A (en) | Graph display device, program, and server device | |
| KR20160033547A (en) | Apparatus and method for styling a content | |
| JP5875262B2 (en) | Display control device | |
| CN111984151B (en) | Whiteboard canvas size and position roaming control method for improving processing efficiency | |
| JP2002091649A (en) | Coordinate input device of touch panel type | |
| JP2014182652A (en) | Information processor and method for controlling the same and program | |
| JP6863918B2 (en) | Control programs, control methods and information processing equipment | |
| CN106990900A (en) | One kind writing implementation method and device | |
| EP3330842A1 (en) | Touch panel type information terminal device, information input processing method therefor, and program | |
| JP2020061193A (en) | Control program, method for control, and information processor | |
| JP2012221262A (en) | Display device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| A621 | Written request for application examination |
Free format text: JAPANESE INTERMEDIATE CODE: A621 Effective date: 20200122 |
|
| A131 | Notification of reasons for refusal |
Free format text: JAPANESE INTERMEDIATE CODE: A131 Effective date: 20200901 |
|
| A977 | Report on retrieval |
Free format text: JAPANESE INTERMEDIATE CODE: A971007 Effective date: 20200831 |
|
| A521 | Request for written amendment filed |
Free format text: JAPANESE INTERMEDIATE CODE: A523 Effective date: 20201023 |
|
| A02 | Decision of refusal |
Free format text: JAPANESE INTERMEDIATE CODE: A02 Effective date: 20210119 |