´Д｀)< ワイの隠れ家

Drop&Draw

• 対象者別にWikiのページを分ける
  1. User向けの説明
     • 説明しすぎない (文字を少なく)
     • 解説しすぎない ("難しそう", "使いにくそう" と思わせない)
     • 使い方を説明しない。実現できることを説明する。
     • どういう類のアプリか (日々の苦悩を和らげるものなのか、楽しい思い出を残しておくものなのか)
  2. 少し詳しい User向けの説明
     • 定義ファイルの作成方法
       • できること・できないこと
  3. 開発者向け (自分向け)
     • 構成
     • "こうするべきだった" という部分
     • 現時点であるべき姿から逸脱している部分
     • 避けた事項とその理由

これは何か

手間をかけずにいい感じの画像を作りたいアプリ

どういうアプリか

使うとどういうメリットがあるのかを書く

• なにが便利になるのか
• なぜこれが必要なのか (他のアプリではない理由)
• できれば図がほしい
• こういう時にぱっぱっと図を作れるようなアプリを作っているのだが；´Д｀) はたして……

このアプリの目的 (優先順)

1. JavaScript, HTML5, CSS3 を覚えるため
2. 技術系Blog siteの記事は、大抵文字での説明ばかりなので少しでも図が増えればいいなと思い……

できること・できないこと

おおまかに「できること」「できないこと」を説明する

Use case

• アルバム写真に装飾を付けたいとき
• 地図画像に道案内用の説明を付けたいとき
• プログラムの作りについて大まかな図を作りたいとき

などを想定

動作環境 (想定)

• Windows 10 (mobile) 上での UWPアプリを想定 (Store appを作ってみたい)
• (Browser上でも動作するようにしたいという思いもある)

特色

• Drag & Dropによる操作を主体とする (file選択 dialogでの 画像file選択操作からの解放)
• アプリ内での統一した操作 (色設定や 表示要素の動きも Palette要素の Drag&Dropで反映)

懸念事項

• アプリで保存したファイルの各ブラウザでの再現度

問題点

• 携帯電話のことを考えきれていない (Explorerからの Drag&Dropができない)

操作方法

• Palleteを経由した場合、要素の背景画像設定になる
• CanvasにDropした場合、画像が1つの要素として表示される

未実装

■ Palette

1. Palette保存
2. Palette読み込み

■ 画像操作

1. overdraw: hideen
2. 要素の表示順変更
3. 画面サイズ，レイアウト
4. Clipboard対応
5. Touch Interface入力
6. Undo

■ 設定

1. 設定画面
2. 最後に起動したときの設定状態の保存・復元

■ その他

1. Canvasの形選択と保存
2. Dialog表示

未解決

• 要素を回転したときのマウス入力とのずれ

制限事項

• Text colorに画像をセットした場合、そのboxの背景に画像をセットできない
  画像textにbackgound-image設定を使っているため。
  beforeを使えば疑似的に背景画像セットも可能だが、致命的な問題ではないため運用で回避してもらうことにする
• 作成画像は HTMLとして保存する (画像fileとして保存できない)
• JavaScriptが書かれた textを dropしても動作しない (div tag内部に展開されるため)

その他

• OSDN上に気になるprojectを発見した。ぺったんR。
  今ワイが作っているような機能も含め、Server, Client両方作ってWeb上で漫画likeな読み物を配信しようというもの。
  超ウルトラスーパーすごい。そしてここのproject wikiには、今自分が知りたい疑問についての回答がいくつか載っているようだ……。

Memo

• どのSourceが画面上のどれに対応するかの図

Palette bar

構成