DraftPadの段落編集アシストReLineのデザインを刷新しました
エディタはワープロではない。
文章を「編集」するとは何か。そのことを考えています。文字を綴ると段落になる。この段落自体を一単位と見なせばどうなるのだろう？ BubblesやRowlineがやっていることですが、自分で作ると考えさせられます。綴られた思考を段落単位で再編成する作業。それに適したデザインはどんな形態だろうか、と。DraftPadアシストのReLineを再びプレビューに戻しました
コードの並べかえをするときは良いんですけど、ブログの仕上がりをイメージするときには使いにくい。一長一短です。プレビューも捨てがたい。迷走しています。でも、プレビューのON/OFFをすれば問題が解決する...
段落を意識してもらうために下線で区切りました。ReLineは、何をするのか分かりにくいアシストだと思います。だから「塊」を浮き上がらせる。段落を「カード」とする。DraftPad 1.6.2
分類: 仕事効率化,ユーティリティ
価格: 無料 (Manabu Ueno)
draftpad://self/web?source=<meta name=viewport content=initial-scale=1,maximum-scale=1><meta name=format-detection content=telephone=no><body style=background:lightgray;margin:0;><div id=wine></div><script>preview=last=0;list=new Array();stack=new Array();wine.ongesturestart=function(){preview=1-preview;Disp()};function Minus(x){stack.push(list[x]);list.splice(x,1);Count(x)}function Plus(x){s=(stack.length>0)? stack.pop():%22%22;list.splice(x,0,s);Count(x)}function Count(x){last=0;for(i=0;i<x;i++)last+=list[i].length+1;Disp()}function Disp(){s=%22%22;for(i=0;i<list.length;i++){content=(preview==1)?list[i]:list[i].replace(/</g,%22%26lt;%22);s+=%22<table width=100%25><td valign=top onClick=Minus(%22+i+%22) style=width:32px;color:lightgray;background:darkred;>%22+(%22000%22+(i+1)).slice(-4)+%22</td><td onClick=Plus(%22+i+%22)>%22+content+%22</td></table><hr>\n%22;}wine.innerHTML=s;draftpad.title(%22ReLine: %22+list.join().length)}function main(x){preview=x.preview;list=x.whole.split(%22\n%22);Disp()}location=%22draftpad:///webdelegate?load=main%26unloadconfirming=true%26unloadconfirmtitle=保存しますか？%26unloadconfirmdefault=はい%26unloadconfirmclose=いいえ%26unload=function(){s=list.join(\"\\n\");draftpad.replace(s,last)}%22</script></body>&whole=<@@>&preview=1登録リンクはこちら→ http://tinyurl.com/mzhujuw
行番号をタップするとカードを削除します。従来と反対の操作にしたのは、うっかりカードを消してしまうリスクを減らすためです。それに合わせ、行番号の背景も赤くしました。何か行う「帯」だと暗示しながら、触ると危険な雰囲気を醸したつもりです。
行番号とは反対に、本文をタップするとカードの挿入になります。イメージしているのは、viエディタの行操作。削られた順にスタックし、新しい順にペーストする。LIFOと呼ばれる操作をDraftPadで実現してみました。もし何もスタックしていない場合は空行を挿入します。こういうの、どうデザインすれば直観的に伝わるだろう？
デフォルトはプレビュー・モードで起動します。HTMLタグを解釈して表示。これが不便な場合は二本指でスワイプしてください。あるいはピンチインでもOK。プレビュー表示とコード表示をトグルで切り替えます。アシスト末尾を「&preview=0」にすると、コード表示で起動します。プレビュー表示で不具合が起こるときにお使いください。
ReLineの利点は、段落編集がDraftPadで完結すること。オンラインである必要もない。文の流れを具現化し「編集」する。編み直す。iOSの操作系では、ここあたりが蔑ろにされています。長文が書きづらい。それを少しでも改善するデザインになれたらと思います。
追記: 2013/08/29
