読者です 読者をやめる 読者になる 読者になる

Flashcards DeluxeのSiriによるTTS(音声読み上げ)で高品質な他言語音声を追加する方法

Flashcards Deluxe(以下、FCDと省略)は多機能な単語帳アプリですが、中でもTTS(Text to Speech、音声読み上げ)は目玉機能の一つです。

Flashcards Deluxe

Flashcards Deluxe

  • OrangeOrApple.com
  • 教育
  • ¥480

TTSを使えば単語帳のカードのテキストを元にして自動的に音声を付加できるため、特に外国語学習に威力を発揮します。

かつては音声データをダウンロードする手法のみが取られていましたが、iOS純正の読み上げ機能も使用出来るようになってからは、カードの修正の度にダウンロードし直す必要もなくなりました。

まずはFCDのカードにTTSを適用する方法から。

カードを表示させた状態の右上の設定ボタンよりDeck Options→Sound→Text to Speech (TTS)→Voice (音声を付加したい面の番号)と進んで使用したい音声を選択します。

▽音声選択画面*1*2

▽選択したボイスはデッキ中のカード全てに適用され、カードをめくると出てくる再生ボタンを押すと発音してくれます。

デフォルトでも多種多様な言語と音声が用意されていますが、追加もできるのです。

▽設定アプリより一般→アクセシビリティ→視覚サポート→Voice Over→スピーチと進み「ローターで選択可能な言語」より音声を追加したい言語を選択します。無ければ「新しい言語を追加…」より追加します。

▽対象の言語の中で試したい音声を見つけたら右の雲ボタンを押すとダウンロードされます。ダウンロードが完了したら再生ボタンで音声を確認しましょう。*3
カッコつきで拡張とあるのは高品質音声です。


▽設定アプリでの追加が終わったらFCDのTTS設定画面を開き直します。設定アプリで追加した音声が選択可能になっているはずです。

ちなみにTTS設定画面の中で現行のSiriは、日本語だと男声はHattori、女声はO-ren。アメリカ英語だと男声はAaron、女声はNickyです。迷ったらこれらを(アメリカ英語は拡張(=Enhanced)を利用して)使用すると聞き取りやすいでしょう。

あとがき

以上、FCDのヘルプに書いてあったことを元に解説してみました。もっとFCD使いが増えればいいな。

*1:上部のiSpeechと下部のSiriでブロックに分かれていますが、ここではSiriブロックにある音声を選択します。

*2:ボタンの配置や背景や文字色をカスタマイズしてますが操作順序は同じです

*3:声が微妙だったらフリックして削除しましょう。

インラインで計算可能なiOSキーボードTwo By Two

ちょっと残念な点があるものの、同種のアプリの中ではあまりなかった機能を持っている感じがしたのでご紹介。

アプリを切り替えなくてもキーボード側で計算ができる、いわゆる電卓機能付きキーボードです。

同ジャンルの他アプリはキーボード内で計算して計算結果をエディタに出力します。しかし、Two By Twoは、計算式を普通にエディタ上に出力した後に計算できるのです。

▽例えば「324.25 / 4」と入力して4の直後にカーソルがある状態で「=R」ボタンを押すと「324.25 / 4 = 81.0625」に変換されます。

これにより、すでに他のアプリで入力済みの計算式も計算できますし、計算式の再利用も容易になります。

その他にも[ ]部分を無視して計算してくれるコメント機能だったり、自動カッコ補完だったり、いろいろ良さげな機能があります。


しかしながら、冒頭で述べたように、ちょっと残念な点も。。。

logとlnが逆

ln(10)=1、log(e)=1になります。
例えば小数点を,か.のどちらにするか的な、国によって異なるものは設定から変更可能ですが、logとlnはそういうことはないはずです。おそらくバグです。

!と√が記号に見えて単なる飾り

!(5)=5、√(4)=4になります。これもおそらくバグではないかと。√の代わりには逆数乗4∨2=2を使うのがいいかも。

不正な数式を入力した場合どこまで計算対象として認識されたか分かりにくい

「π=3.1416」であれば4πは?
「4π=3.1416」と計算されてしまいます。正しくは4*π。これはカーソル位置から左方向に計算式として妥当な箇所までしか計算対象とならないためです。


以上、Two By Twoのご紹介でした。
全然関係ない余談ですが、iOS10のホーム画面3Dタッチからの共有にOpenerを使うと、アプリをApp Storeで開いたり、ホーム画面に追加したWebページを好きなブラウザで開いたりが、手軽にできていい感じです。

Opener ‒ open links in apps

Opener ‒ open links in apps

  • tijo, inc.
  • ユーティリティ
  • ¥240

YouTubeフィルタ検索URLジェネレータ

フィルタやソートを選択すると、それらを指定した時のYouTube検索URLが下部に表示されます。*1


キーワード

アップロード日

タイプ

時間

特徴

並べ替え


*1:バイル版ではフィルタの内容を表示してくれませんが、アップロード日と並び替え以外は検索結果に反映されると思います。

テーブルを表示するHandyFlowyスクリプトConv2table

WorkFlowyは基本的に一対多の親子関係を表現します。
多対多の関係を表現したいときは、テーブルの方が適しているでしょう。

また、WorkFlowyでは画像を表示可能。
Get WorkFlowy Inline Images out of your System in 2016 – WorkFlowy Blog
であれば、テーブルだって表示できるはずです。

と考えてHandyFlowyスクリプトを作りました。

HandyFlowy

HandyFlowy

  • Michinari YAMAMOTO
  • 仕事効率化
  • 無料

"@table"が1行目に記述されているノートに対し、2行目以降をテーブルに変換してノートの直上に描画します。
区切り文字は","で。変換はリアルタイムに行われます。

Conv2tableをMemoFlowy経由で登録

function do_parseTbl() {
    $(this).prevAll(".content-tbl").remove();
    var lines = $(this).text().split("\n");
    if ( !/@table/.test(lines[0]) ) return;
    var tbl = '';
    for (var i = 1; i < lines.length; i++) {
        var line = lines[i];
        if (line == '') continue;
        var td = i==1 ? 'th' : 'td';
        tbl += '<tr><' + td + '>';
        tbl += line.split(',').join('</' + td + '><' + td + '>');
        tbl += '</' + td + '></tr>';
    }
    tbl = '<table class="content-tbl">' + tbl + '</table>';
    $(this).before(tbl);
}

function parseTbl() {
    $("div.notes div.content").bind("DOMSubtreeModified", do_parseTbl);
    $("div.notes div.content").each(do_parseTbl);
    $("#expandButton,parentArrow").live("click", function() {
        $("div.notes div.content").each(do_parseTbl);
    });
};

$(window).bind("load hashchange", parseTbl);

var stylesheet = document.styleSheets.item(0);
stylesheet.insertRule(" .content-tbl td,.content-tbl th { border:1px #777 solid;padding:5px; font-size:13px; } ", stylesheet.cssRules.length);

parseTbl();

※2016.05.28 スマホ版の折り畳みボタンタップ時も表示されるように修正

HandyFlowyで日本語タグも一覧表示するTagListUni

こちらのTagListスクリプトのカスタマイズ版です。
d.hatena.ne.jp

HandyFlowy

HandyFlowy

  • Michinari YAMAMOTO
  • 仕事効率化
  • 無料

TagListUniではTagListから以下の箇所を変更しました。
・日本語(含むUnicode)タグも表示されるようにした
・縦方向のリストでなく羅列する形式にした
・文字の大きさのlarge指定をなくし普通の文字サイズにした

使い方はTagListと同じですのでTagListの記事を参照ください。

TagListUniをMemoFlowy経由で登録

url="https://workflowy.com/get_initialization_data";
q=new XMLHttpRequest();
q.open("get",url,false);
q.send(null);
data=q.responseText;
data = data.replace(/((?:\\\\)*)\\(u[0-9a-f]{4})/g, function(arg0,arg1,arg2){return arg1+"%"+arg2});
data=unescape(data);
list=new Array();
tag="@";
for(k=0;k<2;k++){
  d=data.split(tag);
  for(i=1;i<d.length;i++){
    s=d[i].split(" ")[0].split("\"")[0].split("\\")[0];
    if(s && !/[;{)\/\+]/.test(s) && list.indexOf(tag+s)==-1) list.push(tag+s);
  }
  tag="#";
}
list.sort();

listwidth=320;
listleft=(window.innerWidth-listwidth)/2;
html="";
for(i=0;i<list.length;i++){
  html+="<div onclick=Select("+i+") style=padding:5px;overflow:hidden;white-space:nowrap;display:inline-block;>"+list[i]+"</div>";
}

e=document.createElement("div");
e.innerHTML=html;
e.style.cssText="color:black;background:beige;font-family:Hiragino Sans;font-weight:bold;position:fixed;overflow:scroll;text-align:left;height:72%;top:14%;left:"+listleft+"px;width:"+listwidth+"px;z-index:99;border:1px white solid;box-shadow:5px 5px 5px 5px rgba(0,0,0,0.2);";
document.body.appendChild(e);

function Select(x){
  document.body.removeChild(e);
  location="https://workflowy.com/#/?q="+list[x].replace(/#/,"%23");
}

XMLHttpRequestを使わずdocument_view.js内で使われている関数などを使って実装すれば、タグの正確な抽出と高速化ができそうですが、処理の流れを追いきれませんでした。

あとがき

機能拡張スクリプトライブラリ作成計画、良さそうですね。

スクリプトのインポート自体にリスクがある上、MemoFlowy経由のインポートは敷居が高かったり手間取ったりするので、審査済みのスクリプトライブラリからワンタップインポートできたら安全性も利便性も高まりそうです。

ライブラリへの掲載や記事へのリンクの許可については、今のところwineroses氏のコバンザメスクリプトしか作れていないので、右に倣います。

HandyFlowy上でJavaScriptやCSSの動作確認を手軽に行うスクリプトTester

wineroses氏のScriptMakerStylenoteに触発されまして。

HandyFlowy

HandyFlowy

  • Michinari YAMAMOTO
  • 仕事効率化
  • 無料

HandyFlowyの機能拡張スクリプトiPhoneでぽちぽち作成しようとすると、登録するまで挙動がわからず作成中のテストスクリプトをいくつも登録する事態に陥ります。

Testerはテストスクリプトとして登録することなくJavaScriptCSSの挙動を確認できる機能拡張スクリプトです。

window.onerror = function(mes, src, line, col, err) {
  alert('['+line+'] '+mes);
};
(function(){
  var p = pageContainer.getElementsByClassName("project selected noted")[0];
  if(!p){
    alert("No script in Note.");
    return;
  }
  var s = p.getElementsByClassName("notes")[0].innerText;
  var t =  /\}\s*$/.test(s) ? "style" : "script";
  var e = document.createElement(t);
  e.innerHTML  = s;
  document.body.appendChild(e);
})();

TesterをMemoFlowy経由でインポート

MemoFlowy

MemoFlowy

  • Michinari YAMAMOTO
  • 仕事効率化
  • 無料

使い方

ノートにCSS*1を書いてTesterを実行するとスタイルが反映されます。

ノートにJavaScriptを書いてTesterを実行するとJavaScriptが実行されます。

JavaScriptの変数を初期化したりCSSを適用前に戻したりするには右ペインのリロードボタンで。

ついでにJavaScriptで文法ミスなどエラーがあった場合は行番号とエラー内容を表示するようにしました。Workflowy自体のエラーも拾うので必要なくなったらリロードして解除してください。

Testerで色々試した後にScriptMakerやStylenoteで登録、の流れはいかがでしょう。

あとがき(要望)

HandyFlowyはスクリプトを登録するURLスキームが内部でしか使えず、共有するにしても修正するにしても手間がかかるので

  • handyflowy://importを外部から使える
  • 登録時にスクリプトの内容を確認して保存するかを決められる
  • 登録後もスクリプトの確認や修正が出来る

が実現されたらいいなと思いました。

*1:最後の文字が}である場合CSSと判断します。