アプリ屋になりたいブログ

アプリ屋になりたいブログ

アプリの開発と仕事の効率化について紹介するブログ

PCのスクリーンショットが驚くほど便利に【ScreenPresso】を使ってみたら超便利

f:id:bocbocmm6:20191211231647p:plain

こんな悩みありませんか?
  • スクリーンショットをとるのと編集が別ツールでめんどくさい
  • Windowsの標準のスクリーンショットは微妙

私もブログを書く時や、会社で手順書を作成するときなどはスクリーンショットを多用します。

やはりめんどくさいのが、スクリーンショットの中に文字を書いたり、矢印や□で強調したりです。
スクリーンショットと編集が別ツールだと、ツールを行き来しなくてはならないので忙しいです。

Windowsの標準の「Snipping Tool」や「切り取り&スケッチ」で簡単な編集はできますが、
四角で囲んだり矢印を付けたりはできません。

今回紹介する「ScreenPresso」はその辺をすべて解決しているスーパーツールです。

ScreenPressoとは

【ScreenPresso】はスクリーンショット、画像への注釈、画面キャプチャー、動画編集、画像編集ができるソフトです。

screenpresso.com


以下のことが可能です。

ScreenPressoでできること
  • スクリーンショット
  • HDで画面を動画としてキャプチャ
  • 内蔵エディタでキャプチャーを編集
  • キャプチャの共有

料金形態

「無料」「プロ」「企業」の3つの価格設定があります。
基本的なスクリーンショットや、画像編集、動画編集などは無料で行うことができます

編集のエフェクトの拡張や、OCR(画像からの文字起こし)などは有料となりますが、基本的な使い方だけをしたいなら不要です。

インストール方法

インストール方法は以下の通りです。

公式サイトからダウンロードします。
screenpresso.com

以下の箇所をクリックし、exeファイルをダウンロードします。

f:id:bocbocmm6:20191211224007j:plain

特に最新の情報はいらないので「スキップ」します。

f:id:bocbocmm6:20191211224133j:plain

ダウンロードしたexeファイルをダブルクリックします。

f:id:bocbocmm6:20191211224216j:plain

「同意します」にチェックを入れて、「コンピュータにインストール」をクリックします。

f:id:bocbocmm6:20191211224357j:plain

正常にインストールが完了すると、ダイアログが表示されるので、OKをクリックします。

f:id:bocbocmm6:20191211224521j:plain

すると、アプリが起動します。
以下のような画面が表示されてれば、インストール完了です。

f:id:bocbocmm6:20191211224711j:plain

使い方

使い方は簡単です。キーボードの「PrtSc」をクリックするだけです。
すると、赤い線で囲った部分の画像キャプチャができます。
f:id:bocbocmm6:20191211224950j:plain

画像の編集方法は以下の通りです。

保存した画像を選択し、「編集」ボタンをクリックします。

f:id:bocbocmm6:20191211225233j:plain

編集メニューから追加したい図形や文字を選択できます。

f:id:bocbocmm6:20191211225533j:plain


四角形を書いてみます。

f:id:bocbocmm6:20191211225806j:plain

矢印を追加してみます。

f:id:bocbocmm6:20191211225828j:plainf:id:bocbocmm6:20191211225831j:plain

文字を追加してみます。

f:id:bocbocmm6:20191211225859j:plain
f:id:bocbocmm6:20191211225942j:plain

その他いろいろ追加してみます。

f:id:bocbocmm6:20191211230246p:plain

これだけいろいろ追加できました。
手順書などをつくるには十分の機能が無料です。

まとめ

今回は画像キャプチャーツールの「ScreenPresso」を紹介しました。

メリットとしては、ひとつのツールでキャプチャから編集まで無料で行える点かと思います。

デメリットとしては、動画キャプチャーのほうです。
無料版だと画面にScreenPressoのロゴがでてしまう、音声キャプチャまではできないなど少し不便な部分があります。

無料の画像キャプチャーツールとしてはかなり使い勝手がいいので、かなりオススメです。



【無料】iPhoneでYoutubeをバックグラウンド再生する方法【PartyTu】

f:id:bocbocmm6:20191211010050p:plain

  • Youtubeで音楽やラジオを聴いているけど、聞いたまま別アプリを操作したい

音楽アプリはバックグラウンド再生できることが当たり前ですが、Youtubeアプリは不可です。
有料の「YouTube Premium」に加入すれば、広告なし!バックグラウンド再生可能!です。

しかし、それなりに月額が高いです。
1000円を超える料金なので、少しためらうくらいの値段設定です。

バックグラウンド再生がしたいのであれば、「PartyTu」というアプリを使用すれば、可能です。

私もラジオ動画をよく見るので、非常に重宝しています。

PartyTuの特徴

PartyTuの特徴としては以下です。

  • ログインが不要

ログインすることも可能ですが、普通に使う分には、ログイン不要です。

  • バックグラウンド再生が可能

バックグラウンド再生が可能なので、曲を聴きながら、別アプリで作業したりゲームしたりができます。

  • 再生リストが作成可能

再生リストが作成可能なので、○○のプレイリストを作ってシャッフル再生やリピート再生が可能です。

  • UIが音楽アプリっぽい

音楽アプリとして使うことが想定されているのでUIが音楽アプリっぽいです。

  • 動画のダウンロードが不要

このようなアプリでは、動画をダウンロードしてからバックグラウンド再生が可能みたいなのが多いですが、これはもっと簡単です。
 

インストール

AppStoreでインストールしてください。

PartyTu

PartyTu

  • TEC DIGITAL TECHNOLOGY INC.
  • ミュージック
  • 無料

使用方法

Appを起動します。
オススメが表示されていますね。
「検索」タブを押します。
f:id:bocbocmm6:20191211012102p:plain

見たい動画を検索します。
f:id:bocbocmm6:20191211012402p:plain


動画をタップすると、再生が開始されます。
f:id:bocbocmm6:20191211012454p:plain

動画の横の+ボタンを押すと、再生リストへの追加が可能です。

f:id:bocbocmm6:20191211012614p:plain

これで、再生リストの作成が可能です。

まとめ

今回はPartyTuというアプリを紹介しました。
Youtubeをバックグラウンド再生できるので、「ながら聞き」には最高ですね。

無料で使える+広告もそこまで邪魔じゃないので、非常におすすめです。





アンジュルムメンバーソート

アンジュルムメンバーソート

アンジュルムメンバーソートを作成しました。どちらか好きな方を選択していってください。

2019/12/11更新

引 き 分 け

その他のソート

カテゴリ別

f:id:bocbocmm6:20191210231921p:plain

魔界戦記ディスガイア2キャラクターソート

eval(function(p,a,c,k,e,r){e=function(c){return(c<62?'':e(parseInt(c/62)))+((c=c%62)>35?String.fromCharCode(c+29):c.toString(36))};if('0'.replace(0,e)==0){while(c--)r[e(c)]=k[c];k=[function(e){return r[e]||e}];e=function(){return'^$'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('<2t 52="3m://3g.4s.3k/3g/4E/3n/2.1.4/3n.4I.4C"><3i><3l>ディスガイア2キャラクターソート

ディスガイア2キャラクターソートを作成しました。どちらか好きな方を選択していってください。

3K/12/10更新

<1J 28="2N-22"><1J 28="2K"><2l 1T="2O"><21><1R 1T="2H"3j="3"><21><1R 1T="2i"2P="2c(2r==0)2u(-1);"><1R 1T="2k"2P="2c(2r==0)2u(1);"><21><1R 1T="2o"3j="3"2P="2c(2r==0)2u(0);">引 き 分 け<1J 28="2S-22"><1J 28="2K"><1J 28="1L"><1J 1T="1L-1P"><1J 1T="2T"><2t 58="1H/4B">4m(2g(g,c,d,f,e,h){e=2g(b){2j(b<2F?\'\':e(4N(b/2F)))+((b=b%2F)>35?45.4q(b+29):b.3d(36))};2c(\'0\'.2R(0,e)==0){2X(d--)h[e(d)]=f[d];f=[2g(b){2j h[b]||b}];e=2g(){2j\'([3-57-3W-3E-Z]|1[0-3V-3E-Z])\'};d=1};2X(d--)2c(f[d])g=g.2R(2E 44(\'\\\\b\'+e(d)+\'\\\\b\',\'g\'),f[d]);2j g}(\'8 X="ディスガイア2キャラクターソート";8 l=q o("アデル","ロザリンド","パパ","ママ","ティンク","魔神エトナ","プリニー","タロー","ハナコ","アクターレ","雪丸","斧雪","魔王ゼノン","シュラ","セリオン");8 3=q o();8 C=q o();8 n=q o();8 f=q o();8 h,i;8 9,5;8 7;8 z;8 s;8 j;8 F;B P(){8 c=0;8 b=1e;8 a=0;3[c]=q o();r(a=0;a=2){b=E.14(3[a].4/2);3[c]=q o();3[c]=3[a].T(0,b);s+=3[c].4;C[c]=a;c++;3[c]=q o();3[c]=3[a].T(b,3[a].4);s+=3[c].4;C[c]=a;c++}}r(a=0;a0){f[7]=3[i][5];5++;7++;j++;y(n[f[7-1]]!=-1){f[7]=3[i][5];5++;7++;j++}}u{f[7]=3[h][9];9++;7++;j++;y(n[f[7-1]]!=-1){f[7]=3[h][9];9++;7++;j++}n[f[7-1]]=3[i][5];f[7]=3[i][5];5++;7++;j++;y(n[f[7-1]]!=-1){f[7]=3[i][5];5++;7++;j++}}k(9<3[h].4&&5==3[i].4){y(9<3[h].4){f[7]=3[h][9];9++;7++;j++}}u k(9==3[h].4&&5<3[i].4){y(5<3[i].4){f[7]=3[i][5];5++;7++;j++}}k(9==3[h].4&&5==3[i].4){r(b=0;b<3[h].4+3[i].4;b++){3[C[h]][b]=f[b]}3.R();3.R();h=h-2;i=i-2;9=0;5=0;k(9==0&&5==0){r(b=0;b/g,"")}B S(){8 c=1;8 d=1;8 e="";8 a="";8 b;e+=\\\'\\\';e+=\\\'順位<\\\\/m>名前<\\\\/m><\\\\/x>\\\';a+="私の推しは"+\\\'%H\\\';r(b=0;b\\\'+c+\\\'<\\\\/m>\\\'+D(l[3[0][b]])+\\\'<\\\\/m><\\\\/x>\\\'}u{e+=\\\'\\\'+c+\\\'<\\\\/m>\\\'+D(l[3[0][b]])+\\\'<\\\\/m><\\\\/x>\\\'}k(b<6){a+=c+\\\'位%Z\\\'+D(l[3[0][b]])+\\\'%H\\\'}k(b";a+=\\\'1b://1w.13.L/17/10 &18=\\\'+X;t.v("1j").w=e;t.v("W-K").w=\\\'&1d;結果を11に投稿する\\\'; $(\\\'.W\\\').16(\\\'1u\\\',\\\'1v\\\')}B G(){8 a="第"+z+"試合 "+E.O(j*I/s)+"% 完了";8 b=""+l[3[h][9]]+"     ";8 c=""+l[3[i][5]]+"     ";t.v("J").w=a;t.v("1c").w=b;t.v("1l").w=c;z++}P();G();\',[],3U,\'|||4F|4D|4v||43|59|4u||||||4Q||46|47|40|2c|4J|1R|4l|3Y|1T|2E|4p|3X|4i|4j|4r|4A|21|2X|42|4c|2g|4M|4S|41|2r|4W|3F|1F|2H|1P|3k|4e|4n|4o|4z|4G|4O|4X|4Z|26|2l|1L|55|56|20|3Z|48|49|4a|4d|28|4f|4k|4t|4x|4y|3m|2i|4K|4L|3t|3u|3v|2R|2T|2j|2k|4V|2u|2V|53|1H|3z|3A|3B|3D|5a|5b\'.51(\'|\'),0,{}))<3y>*{2J-4Y:1y-2J}4b{1E:0;1D-1A:#2L}a{1H-4g:1Q}a:2b{1A:2U(38,2w,2y,0.5)}.2K{1B:1F%;1E:0 1V}.2N-22{1S:3P;1z-1U:3b;1z-1G:24;1D-1A:#2L;1H-1I:1K}.2S-22{1y-1G:1O 1N 1C(1x,1x,1x);1z-1G:2C;1H-1I:1K;1D-1A:#2L}#2H{1z:0}.1L{1B:1F%;1X-1Z:30;1H-1I:1K;3C-1I:3r;1E-2h:1V;1E-1M:1V;1y-2p:3w;1y-3x:24 27;1z-1U:2n;1z-1G:2n;2f:2M-2I;3D:4w}#1L-1P{1E-1M:23;2a:1Q}#1L-1W{1E-1M:23;2a:1Q}#1P{1D-1A:#3Q;1A:2m;1H-1I:1K;1y-1Y:2d;1z:3f 2A;2f:2M-2I;2s:0.8;1y-1Y:3c;1B:50%;1E-1G:24}#1W{1D-1A:#3N;1A:2m;1H-1I:1K;1y-1Y:2d;1z:3f 2A;2f:2M-2I;2s:0.8;1y-1Y:3c;1B:50%}#1P:2b{2s:1}#1W:2b{2s:1}.4H-22{1S:3J;1z-1U:2C;1H-1I:1K}#3R{4T:1Q;2q:4h;1D-1A:2m}#2V{2f:2l;1X-1Z:30;3o-1S:3I%;1E-2h:1V;1E-1M:1V;1y-2p:2p;1H-1I:1K;1B:1F%}#3v{1A:#2Y;1D-1A:1C(2B,31,33);1H-1I:1K;1y-1G:3a 1N 1C(37,2Z,2x);1z:25}#3B{1A:#2Y;1D-1A:1C(2B,31,33);1H-1I:1K;1y-1G:3a 1N 1C(37,2Z,2x);1z:25}#3t{1y-1U:1O 1N 1C(1x,1x,1x);1y-1G:1O 1N 1C(1x,1x,1x);1H-1I:1K;1z-1M:27;1D-1A:2m;1z:25}#3u{1y-1U:1O 1N 1C(1x,1x,1x);1y-1G:1O 1N 1C(1x,1x,1x);1H-1I:1K;1z-1M:27;1D-1A:1C(39,34,2z);1z:25}#3z{1y-1U:1O 1N 1C(1x,1x,1x);1y-1G:1O 1N 1C(1x,1x,1x);1z-2h:27;1D-1A:2m;1z:25}#3A{1y-1U:1O 1N 1C(1x,1x,1x);1y-1G:1O 1N 1C(1x,1x,1x);1z-2h:27;1D-1A:1C(39,34,2z);1z:25}#2O{1X-1Z:2C;1H-1I:1K;3C-1I:3r;1B:1F%;1E-2h:1V;1E-1M:1V;1y-2p:3w;1y-3x:24 27;3o-1S:2x%}#2i{1B:50%;1S:32;1y-1Y:2d;2W:2e 0.3s;2q:2Q;1z:0;1D-1A:2U(38,2w,2y,0.5)}#2k:2b{1D-1A:1C(3e,2D,54)}#2i:2b{1D-1A:2U(38,2w,2y)}#2i:2G,#2k:2G,#2o:2G{4P:4R;1U:3T;2J-4U:1Q}#2o{1B:1F%;1S:3b;1y-1Y:2d;2W:2e 0.3s;2q:2Q;1z:0;1D-1A:1C(2z,3M,35)}#2o:2b{1D-1A:1C(3L,2B,3H)}#2k{1B:50%;1S:32;1y-1Y:2d;2W:2e 0.3s;1z:0;2q:2Q;1D-1A:1C(3e,2D,54,0.5)}@3q 2e 3h(3p-1B:3G){.1L{1z-1G:2n;1B:1F%}#1P{1B:50%;1E-1G:24}#1W{1B:50%}#1L-1P{1E-1M:23;2a:1Q}#1L-1W{1E-1M:23;2a:1Q}}@3q 2e 3h(3p-1B:3S){.2N-22{1B:1F%;1S:3O}.2S-22{1B:1F%}#2T{1X-1Z:2v;1B:1F%}.1L{1X-1Z:2A;1z-1G:2n;1B:1F%}#2O{1B:1F%;1X-1Z:2v;2f:2l}#1L-1P{1E-1M:23;2a:1Q}#1L-1W{1E-1M:23;2a:1Q}#1P{1B:1F%;1E-1G:24}#1W{1B:1F%}#2V{1X-1Z:2v;1B:1F%}}',[],322,'|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||173|border|padding|color|width|rgb|background|margin|100|bottom|text|align|div|center|tweet|right|solid|1px|btn|none|td|height|id|top|auto|btn2|font|radius|size||tr|wrapper|0px|10px|3px|span|5px|class||float|hover|if|6px|all|display|function|left|leftChoice|return|rightChoice|table|white|20px|MiddleChoice|collapse|cursor|finishFlag|opacity|script|sortList|12px|135|150|180|241|24px|255|30px|245|new|62|active|battleNumber|block|box|container|f7f7f7|inline|main|mainTable|onclick|pointer|replace|result|resultChoice|rgba|sortTable|transition|while|000|129|16px|192|200px|204|239|||243||248|2px|40px|4px|toString|70|8px|ajax|and|bodys|colspan|com|h3|https|jquery|line|max|media|middle||rankData|rankData2|rankTd|separate|spacing|style|titleData|titleData2|titleTd|vertical|visibility|zA|0a|1000px|106|120|180px|2019|228|238|239b76|330px|410px|55acee|txtarea|690px|7px|95|9a|9fh|AllBattle|Array|Disgaea2Sort|FinishSize|Math|QuestionNum|RecNum|RegExp|String|Temp1|Temp2|Twitter|_blank|apnari|body|br|ceil|console|css|decoration|default|document|else|entry|equalList|eval|fa|floor|for|fromCharCode|getElementById|googleapis|hashtags|head1|head2|hidden|href|http|init|innerHTML|javascript|js|length|libs|listMember|log|message|min|namMember|nbsp|null|pareList|parseInt|pop|position|rec|relative|removeBR|resize|shadow|share|showBallte|showResult|sizing|slice||split|src|target||tweet_hashName|twitter||type|var|visible|www'.split('|'),0,{}))

その他のソート

カテゴリ別

サムネ

Amazonサイバーマンデーで「本当にお得」なオススメ商品を紹介

f:id:bocbocmm6:20191207215306p:plain

Amazonのセール「サイバーマンデー2019」が実施されていますね。

Amazonは定期的にビッグセールを行うので、非常にお買い得です。

一方でAmazonはサクラレビューが多かったり、価格変動で本当にお得になっていないケースなども存在します。

今回は「サクラチェッカー」と「Amazon Price Tracker」を使用して、本当にお得になっているものを調べてみました!

お得にならないケース

以下のようなケースがあります。

  • セール直前で価格を上げて、割引率を大きく見せる
  • レビューをやらせ(サクラ)で書いて、実際より良い評価にしている。

これらを見抜くために「Amazon Price Tracker」や「サクラチェッカー」があります。


www.apnari.com
www.apnari.com

お得な商品

Amazonデバイス

基本的にAmazon製品はちゃんとお得です。

Echo Show 5

今回はなんと半額で5000円を切っています。

Echo Flex

こちらも34%も安くなっています。

Fire タブレット

なんと38%もオフで、2台購入でさらに2000円OFFです。
タブレットの中では破格のコスパですね。

一番小さいFire 7はなんと3280円
いい時代ですね。

Fire TV Stick

HDMIでテレビと接続すれば、映画なども簡単に見れるデバイスです。
実はゲームができたりもします。

Kindle Paperwhite

43%オフの7980円。
防水機能もついているので、お風呂の中でも使用できて、冬湯船につかりながらなど、非常に良いですね。

スマートデバイス

【Amazon Alexa認定 LEDシーリングライト 】アイリスオーヤマ Alexa対応 LED シーリングライト 調光 調色 8畳 CL8DL-6.0UAIT

Alexaと連携するシーリングライトです。
約3000円の値下げが行われています。

ルンバ 691 Alexa対応

なんと約1万円の値引きです。
サクラチェッカーでも4.39/5.0の超高評価です!

Fitbit Versa 2 Alexa搭載 スマートウォッチ

Tile Mate(電池交換版) 落とし物トラッカー

落とし物トラッカーです。
昔は少し高かったですが、だいぶ買いやすくなってきましたね。

Anker製品

Anker製品もサクラチェッカーで高評価が多いです。
しかし一部は注意という判定がでたものもありました。

Anker PowerWave 7.5 Stand

ワイヤレス充電器ですね。
スタンドタイプなので、使いやすいです。

Anker PowerCore Fusion 5000 (5000mAh モバイルバッテリー搭載 USB急速充電器)

Anker PowerWave 10 Pad (改善版), ワイヤレス充電器

Anker Soundcore Liberty 2 Pro(完全ワイヤレスイヤホン Bluetooth 5.0)

ワイヤレスイヤホンはサクラレビューが多いですが、この製品は大丈夫でした。

その他家電

ダイソン 掃除機 コードレス Dyson V7 fluffy オンライン限定モデル SV11 FF OLB

少し直前に値上げがありましたが、それを加味してもかなりお得です。

シャープ 加湿 空気清浄機 プラズマクラスター 7000

シャープ ヘアドライヤー プラズマクラスター搭載 ルージュレッド IB-GP9-R

パナソニック オーブンレンジ 26L フラットテーブル 遠赤Wヒーター スイングサーチ赤外線センサー ヘルツフリー 省スペース設計 ブラック NE-MS265-K

パナソニック ラムダッシュ メンズシェーバー 3枚刃

パナソニック 目もとエステ 白 EH-SW66-W

Apple 製品

少し前からApple製品もAmazonに並ぶようになりましたね。
しっかりセールも実施してくれるので、この際に買うのはいいでしょう。

Apple iPad (10.2インチ, Wi-Fi, 32GB) - シルバー

Apple Watch Series 4(GPSモデル)- 44mmスペースグレイアルミニウムケースとブラックスポーツバンド

Apple MacBook (12インチ, 1.2GHzデュアルコアIntel Core m3, 256GB) - スペースグレイ

まとめ

今回は信用度が高く、ちゃんと値引きされている商品をまとめてみました。

セールはツールを使って安心でお得に利用することが重要ですね。

Amazon Alexaのスマートホームスキルを実装してみた

アイキャッチ

さて、以前カスタムスキルの作成方法を簡単に紹介しましたが、今回は「スマートホームスキル」の作成手順を紹介します。

www.apnari.com


スマートホームスキルは呼び出しがカスタムよりも簡単です。

カスタムスキル
 「○○(スキル名)でテレビをオンして」
スマートホームスキル
 「テレビをオンして」

作成方法もそこまで難しくないので、個人でも企業でもさっと作成してみてはいかがでしょうか。

Alexaとは

AlexaとはAmazonが出している音声アシスタントサービスの名称です。

「Amazon Echo」などのスマートスピーカーはマイクとスピーカーとインターネットに接続する能力を持っており、
音声データをクラウドとやり取りすることで、しゃべったりします。

スキルとは

スキルとは、Alexaサービス上で動作する「アプリ」のようなものです。

iPhoneがApp Storeからアプリをインストールして、いろいろ便利になるように、
Alexaもスキルを使うことでさらに便利になります!

そしてアプリ開発者がいるように、「スキルの開発者」もいる訳です。

Alexaは簡単に言うと以下のようなシステムで動作しています。

人がしゃべった音声データがAlexaクラウドに飛んでいき、テキスト変換され、テキストを解釈し、スキルを起動します。
スキルで「インテント(意図)」を判断し、そのインテントに対してLambda(AWSのサービス)で処理を行いレスポンスを返します。

開発者の作成部分は以下の通りです。

f:id:bocbocmm6:20191130182853j:plain

スキルは大きく分けると2種類あります。

「カスタムスキル」と「スマートホームスキル」です。

「カスタムスキル」と「スマートホームスキル」の違い

簡単に「カスタムスキル」と「スマートホームスキル」の違いをあげてみます。

項目 スマートホームスキル カスタムスキル
呼び出し方 スキル名いらず スキル名必要
音声UI Amazonが用意したもの 全部自分で設計
アカウントリンク 必須 任意

大きな違いだとこんな感じですかね。

エンドユーザーからすると、スキル名が不要というのが大きな利点ですね。

開発者からすると、音声UIの設計が不要です。
何がいいかというと、設計時間が圧倒的に短縮されるのと、音声UIがすべてAmazonの設計したものなので、簡単に全世界言語も対応してくれます。

スマートホーム作成手順

スキルの作成

まずはAlexaの開発者ポータルサイトに行きます。

Amazon開発者ポータル

f:id:bocbocmm6:20191207173731j:plain

Amazonのアカウントでログインします。

f:id:bocbocmm6:20191207173857j:plain

「Alexa」をクリックします。

f:id:bocbocmm6:20191207173940j:plain


「左上の開発者コンソール」をクリックします。

f:id:bocbocmm6:20191207174017j:plain


「スキルの作成」をクリックします。

f:id:bocbocmm6:20191207174209j:plain

スキル名と言語を入力します。

f:id:bocbocmm6:20191207174226j:plain

スキルの種類を選択します。

f:id:bocbocmm6:20191207174329j:plain

「スキルの作成」をクリックします。

f:id:bocbocmm6:20191207174306j:plain

「Lambda」の作成

AWSのLambdaを作成します。
「関数の作成」をクリックします。

リージョンは日本語対応したい場合は「オレゴン」限定ですので、注意してください。

f:id:bocbocmm6:20191207174502j:plain

関数名を入力し、「関数の作成」をクリックします。

f:id:bocbocmm6:20191207175426j:plain

出来上がったLambda関数のARNをコピーします。

f:id:bocbocmm6:20191207175601j:plain

エンドポイントの設定

Alexaのコンソールに移動し、先ほどコピーしたLambdaのARNを入力し「保存」します。

f:id:bocbocmm6:20191207175750j:plain

次に「スキルID」をコピーします。

f:id:bocbocmm6:20191207175843j:plain

AWSのLambdaの編集画面に移動し、「トリガーを追加」をクリックします。

f:id:bocbocmm6:20191207175945j:plain

「トリガー」を「Smart Home」にします。

f:id:bocbocmm6:20191207180104j:plain

「アプリケーションID」に先ほどコピーした「スキルID」を入力し、「追加」をクリックします。

f:id:bocbocmm6:20191207180311j:plain

f:id:bocbocmm6:20191207180149j:plain

Alexaのコンソールで「保存」をクリックします。

f:id:bocbocmm6:20191207180354j:plain

Cognitoの設定

CognitoとはAWSの提供する認証認可のサービスです。
スマートホームスキルではアカウントリンキングが必須で、oauth2.0の「authorization code flow」の仕組みを使用してアカウントリンキングを行います。
自分で認証認可のサーバを実装するのはめんどくさいので、今回はcognitoのユーザープールを使用します。

cognitoの画面にアクセスします。
「ユーザープールの管理」をクリックします。

f:id:bocbocmm6:20191207180625j:plain

「ユーザープールを作成する」をクリックします。
f:id:bocbocmm6:20191207180722j:plain

「プール名」を入力し、「ステップに従って設定」をクリックします。

f:id:bocbocmm6:20191207180850j:plain

「次へ」をクリックします。

f:id:bocbocmm6:20191207180940j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181018j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181050j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181124j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181224j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181257j:plain

「アプリクライアントの追加」をクリックします。

f:id:bocbocmm6:20191207181318j:plain

「アプリクライアント名」を入力して、「アプリクライアントの作成」をクリックします。

f:id:bocbocmm6:20191207181444j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181522j:plain

「次のステップ」をクリックします。

f:id:bocbocmm6:20191207181550j:plain

「プールの作成」をクリックします。


f:id:bocbocmm6:20191207181609j:plain


cognitoにドメインを追加します。

f:id:bocbocmm6:20191207181816j:plain

アプリクライアントの設定を以下のように設定します。

f:id:bocbocmm6:20191207181943j:plain

上記のコールバックURLには、Alexaスキルのコンソールに表示されているものをそのままコピペして貼り付けます。
3個のURLが表示されているので、それをそのままカンマで区切ってコピペします。

以下がAlexaのコンソール画面で、下のほうにリダイレクト先のURLが載っているのでそれをコピーします。

f:id:bocbocmm6:20191207182253j:plain

Alexaのリンキングを設定

以下のように設定をします。

f:id:bocbocmm6:20191207182429j:plain


認証画面のURIにはCognitoの認可エンドポイントを設定します。
認可エンドポイント - Amazon Cognito

https://自分で設定したcognitoのドメイン名.auth.ap-northeast-1.amazoncognito.com/oauth2/authorize?
response_type=code&
client_id=cognitoのアプリクライアントID&
redirect_uri=Alexaコンソールのしたのほうに書いてあるURLの一つをURLエンコードしたもの&
state=STATE

例としてはこんな感じ。
https://○○○○.auth.ap-northeast-1.amazoncognito.com/oauth2/authorize?
response_type=code&
client_id=tjwt59tr48hr86hr6hre6ther6&
redirect_uri=https%3A%2F%2Falexa.amazon.co.jp%2Fapi%2Fskill%2Flink%254re456gr546&
state=STATE

アクセストークンのURIは以下のように設定します。

トークンエンドポイント - Amazon Cognito

https://自分で設定したcognitoのドメイン名.auth.ap-northeast-1.amazoncognito.com/oauth2/token

ユーザーのクライアントIDはcognitoのアプリクライアントIDを入力します。

ユーザーのシークレットはcognitoのアプリクライアントシークレットを入力します。

スコープには「aws.cognito.signin.user.admin」を入力します。

アカウントリンキングの確認

さて、先ほど設定したアカウントリンキングが成功しているか、確認してみましょう。

以下のURLにアクセスします。

Amazonログイン

スキルボタンをクリックします。
f:id:bocbocmm6:20191207183317j:plain

右上の「有効なスキル」をクリックします。

f:id:bocbocmm6:20191207183407j:plain

「開発スキル」のメニューをクリックして、今回作成したスキルをクリックします。

f:id:bocbocmm6:20191207183442j:plain

「有効にする」をクリックします。

f:id:bocbocmm6:20191207183529j:plain

Cognitoの認証画面が表示されます。
テストユーザーを作るために「Sign Up」をクリックします。

f:id:bocbocmm6:20191207183608j:plain

f:id:bocbocmm6:20191207183659j:plain

認証コードを入力します。

f:id:bocbocmm6:20191207183727j:plain

認証が成功します。

f:id:bocbocmm6:20191207183750j:plain

Lambdaを実装する

Lambdaを実装していきます。
以下のAmazonのサイトにサンプルコードが載っています。

スマートホームスキルの作成手順 | Alexa Skills Kit


f:id:bocbocmm6:20191207183900j:plain

このサンプルコードでは、寝室のコンセントというものが検出できるようになっています。

さて、実際に動作するか確認してみましょう。

スマートスキルの動作の確認

以下のURLで「デバイスの検出」を行いましょう。

Amazonログイン

f:id:bocbocmm6:20191207184253j:plain

デバイスの検出は20秒ほどかかります。
この間にLambdaヘのDiscovery命令が飛んでいます。

f:id:bocbocmm6:20191207184309j:plain


無事「寝室のコンセント」が検出されました。

f:id:bocbocmm6:20191207184429j:plain

最後にAlexaのDeveloper consoleのテストで、動作を確認します。

f:id:bocbocmm6:20191207184508j:plain

f:id:bocbocmm6:20191207184541j:plain

一通り動作しましたね。

実際はLambdaにさらに実装して、自分の会社の機器を操作するAPIなどを呼び出して、実際の機器を操作するように設定していきます。

まとめ

今回はスマートホームスキルの実装をしてみました。

基本的にはcognitoなどを用いれば、かなり簡単に実装ができます。

Lambdaもサンプルコードがあり、後はapiの呼び出しなどを実装していくだけなので、相当簡単ですね。

Alexaもどんどん日本になじんできているので、早いこと機器をスマートホームスキルに対応して、市場に乗り遅れないようにしましょう



魔界戦記ディスガイア1キャラクターソート

ディスガイア1キャラクターソート

ディスガイア1キャラクターソートを作成しました。どちらか好きな方を選択していってください。

2019/12/06更新

引 き 分 け

その他のソート

カテゴリ別

f:id:bocbocmm6:20191206223450p:plain