編集に関するいろいろなUI.

UI全般については

UI
  • -

目次 Edit

  • -

関連 Edit


検索:UI

UI周辺のタグ Edit

Array

ページ/編集/UIとは Edit


ページ編集のためのUIについて。

ボタン Edit


ペンタブレット + 手書き文字(あるいはオンライン手書き文字認識)なら、ボタンが便利な省入力になる。ページ/編集時に記法を追加するボタンを用意したり。

iPhoneが登場して、スマートフォンでの省入力が一般的になったので不要。

思い付き Edit


ページ名を表示するようなブックマークレットがあればiPhone用Safariでも便利。

ページ名になるWikiNotationページ編集以外にどこでも使えるようにすることでも解決できそう。

テキストエリアを使わずに編集したい Edit


編集した行頭にマークを付けようとしても、テキストエリアの中にマークを入れないといけない。

フォントが変わってしまうため、閲覧ページと同じ文字で編集したい。

次へ Edit


iPhoneのSafari用に。

ページの更新ボタンを押す必要があるとき、「次へ」ボタンで更新ボタンのそばまでスクロールできる。

編集直後のページ表示では、編集した行に「更新した」というマークを Edit


章立てになっていても、1つの章が長い場合もあるので、行単位で。

よく使うボタンが強調表示になるだけでもいい!!

:i/よく使うボタンを強調表示

つまり、差分表示のページへ遷移。

入力補助なので、クライアント側でやるべき。WikiEngineに組み込むならサーバーにあるデータを選べるようなものを。実装するならWebブラウザーのカスタマイズとして。

→ テキスト選択して、JavaScriptで加工するようなアプリが併用できるので、それでいい。

他には自動処理、マクロ処理的なことをボタンにするといい。

→ テキスト処理を自動化するアプリがあるので、なんでも記法で済ませられればそれで済む。

行単位編集。1行ごとにマークアップしないといけない記法に(引用とか)。でもそういうのは記法を改善すべき。

実は新規作成ページなど無い Edit


PukiWikiと同じく、新規作成は存在しないページ編集

入力欄を一行テキストボックスに変更可能に Edit


Enterで送信できるのが良い。

この場合、改行を別の文字で代用。送信されると改行になる。

メニューバー Edit


挙動はGoogle:checkpad.jpのように。

プラグイン専用欄 Edit


ページ属性を決めるようなプラグインは専用欄に書きたい。

欄内ではソート。

その場編集UIを作成する機能。

テキストエリア。

1行に1つ。

ブックマークを作るようにメニュー項目作成。

メニューに載せるページで「+」アイコンクリック→メニューバーに追加。

内部ではマージ、1つのテキストとして処理。

編集時に別れていればいい。

プレビューは入力欄と違うページ Edit


新しいウィンドウかインラインフレームで。

本当のページでなければプレビューにならない。

プレビュー不要 Edit


戻しやすく戻したときに跡が残らない「更新」を導入する。

→これで編集とプレビューをまとめる。

→他ページから参照される部分もプレビューできる。プレビューが他のページに影響を与えてもいい。

ページ内のリンクをメニューバーにドロップ→メニューバーに追加。

参照不可能でそのうち削除されるページ

プラグインのトリガーのため。

UIから使うためのもの。プラグインでなら元から可能だから。

メニューバーの専用編集モードでドラッグして順序入れ替えとか。

消すボタン封じ Edit


IEであってもESCキーで消えないように。

ESCキーは「範囲選択を解除」とか「IMEの状態を初期化」だけでいい。

リロード時のページ破棄封じ Edit


ページの有効期限を付けて。

またはページ遷移封じを。

フォーム Edit


ページを作るボタンにはテキストボックスを。つまり「…というページを作る」ということ。

ページを作る」よりも「見たいページ」のほうがいい。「…というページを見る」。作成と閲覧と検索UIを一つに。

メニューバーをショートカットキーヘルプにするのも。

メール投稿 Edit


メールで投稿。:/Twitterからとも似ている。

追加。

機能/メール取り込み。mailin.

追加用スペースに。「*草稿(追加待ち)」wikiの組み方で。システムがサポートする機能ではなく。

メールだと元になったが分からないし、元とするを取り寄せてから編集、投稿では手軽さが無いので。

「…というページはありません」ではなく「…について書いてください」というメッセージ

間違えにくい Edit


ページ編集UIで、Alt+SやAlt+PよりもAlt+f 1回、Alt+f 2回のほうが間違えにくい。

ヘルプ検索ボックス Edit


編集中にヘルプを読みたいことがある。
  • 誰でも可
  • 承認したアドレスからのみ可
    アカウントと合わせて。
  • 投稿用アドレスを隠す

誰かの利用者ページ(のサブページ)に追記出来れば、メールとして使える。

Edit

CreateJS

http://www.createjs.com/

音声を読み込んで再生。

テンプレート一覧 Edit


編集欄の傍らにテンプレート一覧とその検索ボックスを。

環境音を加工したり、環境音に連動して何かを鳴らせないか

参考:OmmWriter

テンプレート項目は1行〜3行程度。

検索ボックスに入力→絞り込み、ソート順は前方一致したもの>部分一致したもの。第二キーは辞書順。

アクセスキーやマウスで選択→カーソル位置に挿入
[[Googleで検索:検索キーワード]]

テキストボックスが文字装飾可能なら、「検索キーワード」の部分は淡い文字で。

テンプレートの他、添付ファイルの一覧も。

とりあえず投稿 Edit


一部でも投稿できるように。

Wikiは推敲できるのが特徴なのだから。

ページ名が無い、内容が無い、プラグインに必要な引数が無い、設定が無い、クエリーが無いなど。

後で編集できるように。

※同じUIで。

ページ編集時にページ名変更可能 Edit


編集時、ページ属性としてページ名を表示。

いつでも変更可能。ページ編集できればページ名も変えられる。

新規作成時に既存ページ名を参照したい Edit

ページ/編集ページにGoogle検索リンクを載せたい Edit


編集ページの定義に、ページ名(フルパス)を検索するリンクを入れればいい。

ルートページ/名前も含めれば、そのWikiに関連するページだけが検索されるはず。

コンテンツだけで可能。

ファイル取り込み Edit


定位置に置いてあるファイルを自動的に取り込む。
  1. ファイルを作る
  2. FTPクライアントなどでどこかにアップロード
    他サーバーでも可?

    ※ファイル一覧が得られないと不可能。
  3. 取り込み
  4. マークアップをページに書き込むことで貼り付け

取り込む際、ファイル名がページ名になる。(だから/が使えない)

拡張子次第で取り込み方振り分け。

結果は専用ページ(単一)に。取り込みがあれば通常通りのページ更新。通知機能なども働く。

内容は記録とすぐ活用するための何か(イメージなら貼り付け用のWikiNotationなど)

この一覧のテンプレートページになっていて、編集可能。

:t/インポート

画像を貼りやすく Edit


画像やその他ファイルを貼るとき、既存のファイル名を調べたりしなくていいように。
  • 名前(利用者が扱う名前)が重複したら自動的に変更。
  • 時刻を名前にする。
    プラグイン呼び出しには近い時刻を付ければいい。

…のどちらかで。

「1つ前の」という指定で埋め込める。

編集時に展開されるように。
  • ファイルの種別はMIMEか拡張子から自動判別。

検索可能な一覧を編集ページに。

早く入力するために Edit

続けて新規作成 Edit


新規作成ページページ一覧を備える。

で、送信後にまた空の新規作成ページを返すように。

続けて新規作成ができるようになる。

新規作成ページを別フレームにするのもいい。

フォーム2つに Edit


フォームを2つ用意、Tabキーでフォーカスを移して、1文字でも入力した時点で前のフォームを(バックグラウンドで)送信。

というのもいい。

1文字入力を待つのは間違い防止のため。

全てのページを打ち終わったら「送信」ボタン。最後のフォームを送信してページ遷移。

テキストボックス化 Edit


最近編集したページ一覧で。

ページ名を選択するとテキストボックス化。ページ内容が読み込まれる。

編集後、送信。ページは更新され、テキストボックスはページ名に戻る。

編集日時などは更新してもページリロードまでソートしないこと。

「かんたんプラグイン入力サポート」 Edit


@wikiの「かんたんプラグイン入力サポート」のようなものはどうか?

要はパラメータの意味を出すヘルプがあればいい。入力欄は分けないほうがいい。

打っているそばから表示更新…はカーソル位置が得られないと…差分を得て…は重くて無理。

→選択すると表示。

テンプレート一覧のような検索可能な一覧で実現。

クリックで章追加 Edit


最初の章と最後の章には「ここに追加」ボタンを。

全章に付けてもいい。

ページの途中、任意の章の前に追加するのをやりやすく。

ユニバーサルエディットボタン(Universal Edit Button) Edit

<link rel="alternate"
 type="application/wiki"
 title="このページ編集..."
 href="?%E3%83%9A%E3%83%BC%E3%82%B8%2F%E7%B7%A8%E9%9B%86%2FUI&cmd=edit"
/>

http://universaleditbutton.org/%E6%97%A5%E6%9C%AC%E8%AA%9E

実装 Edit

ページ遷移なし編集を実装するなら Edit

ここに追加1.png

ここに追加2.png

章に付いている編集アイコンで章の編集

細部の編集用。

ここに追加1.png

ここに追加3.png

章末尾の追加アイコンでそこに追加。

編集で章より前に追加しても同じ。分かっている利用者にとってこのボタンは不要。


ページ遷移を伴うがっつり編集モードはページ冒頭のツールバーにでも置いた編集アイコンから。

編集サポートやツールが使いやすいモード。