モバイル向けにアクセシビリティを考えたメニューバーを思いついた作ってみた

最近,UIやらUXやらとデザインを考えることが多くなりそれ系の記事を読み漁ってるんですけど結構おもしろいですね

親指リーチ範囲

ってわかりますか.わかりませんか.まあ簡単に言うと「スマートフォンって片手で操作する時,手の大きさとか操作する指の範囲とか考えたら(右利きで右手のみでスマホを持って操作している場合)押さなければいけないボタンとかが左上にあるのは(指が届きづらいので)操作性というかアクセシビリティが悪いのではないか」って言う考えのアレです.

別に片手操作に限らないのですが,両手持ちだろうと画面の下の方と上のほう,操作しているときにスッと指が届くのは多分下の方だと思います.

近年巨大化する傾向のあるスマートフォンを始めとしたモバイル系のデバイスのディスプレイでの表示を考えるとやっぱり親指リーチ範囲を意識した表示デザインの設計は必須だなあと思っています.

www.gizmodo.jp

2014年の記事ですが,とてもわかり易くまとめられていて良さでした.

まあ今は2018年ですし(2019?)スマホの大きさは巨人向けかってくらいになっているので正直片手のみで扱うより片手で支えながらもう片方の手で操作する形式が多くなっているのかもなあっても思ってたりします. まあ今回はその話は置いておいて.

大手サービスで親指リーチ範囲を考えてデザインされている例

実際意識しているのかはわからないのですけど,

この考え方に即したデザインになっているサービスのモバイル画面を例に出します.

f:id:ten0313:20181112212218j:plain

Googleのマップアプリです.検索バーこそ上の方にありますが,経路検索のためのボタンや「おすすめ」「通勤」「周辺のスポット」などのボタンが右下から下にかけて配置されています.

 

f:id:ten0313:20181112212500j:plain

みんな大好きTwitterの公式クライアントアプリ画面です.ツイートボタン,そして他の表示切り替えボタンが下に配置されています.もっともこの切り替え自体は画面を横スワイプすることで切り替えられるようにもなっています.

 

f:id:ten0313:20181112212728j:plain

slackアプリのやつです.投稿系統のボタンや切り替えが右下から下にかけて配置されています.

 

本題に移るんですけど

長々と親指リーチ範囲を考えたアクセシビリティの高い表示デザインについて書いてきたんですが,やっと本題に移ろうと思います.

僕の考えた最強のモバイルデバイス向けメニューデザイン

です.

f:id:ten0313:20181112213341j:plain

 

スケッチです.説明すると通常はスケッチ下のボタン一つの状態なんですけど,ボタンを押すことでデザイン上のようにメニューボタンが展開され様々なボタンが使えるようになるって感じです.

もちろん展開されたメニューボタンたちはまた格納できるようにしますし再展開も可能です.

作ってみました.

スピード感ってのを意識しようと思って20分くらいでぱぱっと「誰かにこの機能を理解してもらえる」レベルくらいのを作りました.HTMLとCSSのみでの実装です.

palette-menu

はいどうぞ.スマートフォンで開いてください,PC対応はしてないですしスマホでもサイズによって形が崩れるかもしれません.

f:id:ten0313:20181112215150j:plain

緑の丸をタップすることで

 

f:id:ten0313:20181112215226j:plain

各ボタンが展開されてタップできるようになります.再度緑のTouch!ボタンをタップで展開されたボタンたちが消えるようになっています.

このサンプルとして作ったものの展開されたボタンには僕のブログやGitHubへのリンクを貼り付けていますが,何かのサービスで実装するときは各サービスに合わせた機能なりリンク先にすればいいのではと思います.

まとめ

ここで言うべきではないのですが,今回作ってみた機能が目指したのは「すべての機能へのリンクを右下に集約する」よいうことです.

さっき例に出したTwitterクライアントだってツイートボタンこそ右下にありましたが,

自分のプロフィールなど設定をするには左上の自分のアイコンまで指を伸ばす必要があります.

右下にある方がアクセシビリティは高くなりますが,その分機能が密集することで逆にユーザビリティが下がることも危惧されます.

それを考えた上で「せや!使わないうちは機能たちを格納できるようにして右下にあつめたろ!」というのが僕の思いつきでした.

欠点として

・初見でわかりにくい

格納されているうちはその展開されたあとの状態が見れないので直感的に自分の行き着きたい機能までたどり着けにくい

  • 左利きにつらい

もちろん位置を反転させればいい話なのですが,その切り替えや反転したデザインの実装も必要になります.

  • そんなに機能がない場合おしゃれなゴミと化す

今回はサンプルとして展開されるメニューボタンが3つでしたが,正直3つだと普通に右下から下にかけて配置したほうがわかりやすく実装も楽です.

この展開型のデザインが効果を発揮できるのは最低でも4つから5つ以上の展開するボタンの数がある場合だと思います.

 

展開されるモーションもフワッて浮き上がるのでなくにょきにょきって動くほうが好みって声もありました.僕もそう思います.

 

サンプル例として後ろの文章を(何でもよかったのですが)僕の好きなWikipedia記事の「ヒットラー女性化計画」にしています.ぐぐってみたら面白いと思います.

 

ばいばい

 

[ この記事はブログ投稿者の憶測や考えによりつくられています。

よって書いてある内容に誤りや言い間違いがあるかもしれません。もし修正したほうがいい場所や「こういった言い方のほうが”ソレっぽい”よ」などがありましたら後に記載してあります、リンク先のツイッターアカウントに教えてくださると嬉しいです:) ]

 

twitter.com

ReactJS帰省アドベントカレンダー【三日目】

とりあえず一日の終わりにその日覚えたことを羅列しようとするのはやめます

覚えていないので(正確には、覚えてないと言うより自分が何を覚えたのか覚えてないと言う感じですが)

なので何か新しいことを覚えたり確認するたびにバーって書いていきたいと思います。

明日から

JSXを触り始めました

いや、いつ出てくるのかな〜〜って感じで本を読んでいったのですが四章でやっとこさ「いままでややこしいrenderなんとかをご苦労様〜〜、あれ?まだJSX使ってないの?JSX童貞が許されるのなんて中学生までだよね〜〜」みたいな感じで紹介されるので(実際にHTMLライクな書き方ができるJSXは見ていて馴染み深く、書いていても読んでいても分かりやすかったです)怒りを覚えました。

  • defaultValueを知った

要はhtmlで言うvalueのもっと詳しいと言うか何と言うか...最初からの不動的なもの?

react側でdefaultValueプロパティで設定したものは、中身がその後変更されようとtarget.defaultValueで呼び出すことができる...説明がむずかしいので深く理解はできてないみたいです。

XSS攻撃への対策ですが、reactって予め入力された文字列はすべてエスケープされるんですね。少し感動しました(もしかしてこれって常識だったりするんでしょうか)

reactと関係ないことなんですが、少し操作に慣れてきました。

たしかに手の移動が少なくなるのは良いですね。親指の腹がトラックパッドに当たって誤クリックや誤操作してしまうのが嫌で「トラックパッドの検出」をなくしたのがトラックポイントのみのマウス操作を強いられる状況を作る縛りプレイ的なことになったのもトラックポイント操作上達のコツ(?)になったのかもしれません

 

ね、夜中に今日やったことを思い出そうなんて無謀にもほどがあるんですよ

明日からは備忘録的にもいちいちブログの書き込みページに書いて置きたいと思います

ばいばい

ReactJS帰省アドベントカレンダー【一日目】

実家に戻ってるのですが、近くの自販機にいつも買っていたさらりとしたオレンジって缶ジュースが販売中止しているわ(どうやら生産終了?したみたい)キーボードのOキーが利きづらいわ散々です。

アドベントカレンダーをやります。

一回やってみたかったんですよね〜〜〜。12月の初日からクリスマスである12月25日前後までにかけて一日に一記事を何人かで持ち回りで投稿していく企画っぽいのをアドベントカレンダーなんたらっていうらしいですが、僕の所属している高校の技術界隈で今年やるみたいですね〜〜!僕も投稿したかった!!!

 

アドカレ17日目に参加します〜#Qiita #n高https://t.co/8tidLmVF4q

— aoharu514 (@aoharu_514)

2018年11月3日

 

 

まあなんか僕が書くって約束してもその日ガッツリ寝ちゃうかもしれないのが怖いので誰かとブログ記事の投稿なんてやりませんが

とは言ってもぼくも責任の発生しない範囲でやりたいんで

帰省中に勉強しているreactJSの経過とかを書いていけたらなと思っています。

なんかこれを読んだJSの神がいい感じにまさかり投げてくれたりしないかなと思っています。

東京に帰る12日前後までを目標に毎日一日ずつ投稿しようと思っています。

ちなみにこれを始めようとしたのが今日のお昼なのですが、早速さっき寝落ちかけて明日のお昼くらいに

アドベントカレンダー2日目です!

って平然と書く茶番をしてしまうところでした。

とりあえず今の所、ガッツリ書く気力とかもないので明日から報告はしていきます。

ポエム記事になっちゃう日とかもあるかもですができるだけ真面目に書こうという所存です。ばいばい

 

1500円でかっこいいネオン管風サインボードを作りました

この記事の一番下におすすめの開発ブログ記事へのリンク貼ってます、よかったらどーぞ。

この前メルカリで500円のクーポンが配布されたんですよ。500円引きって普通にすごくないですか?僕は喜びました。

item.rakuten.co.jp


(メルカリのリンクを載せたかったんですけど、僕が買ったやつがもう掲載されてなくアア)

ELファイバーを買いました。3mのやつです。

これを買うときにも紆余曲折あったんですけど、まず500円引きのクーポン券が1000円以上の商品にしか使えなかったんですよ。

しかし売られている3mのELファイバーってどれも800円くらいが多かったので僕はコメント機能から「200円値上げして売ってくれないか」っていう謎の逆値引きを行いました。まあでも普通に考えてもうちょっとオトクな方法があるよなって思い直して3個セットで2000円で売ってもらうことで販売者の人にも納得してもらいました。

500円のクーポンを使って大体3mのELファイバーひとつを500円で手に入れたことになります。

f:id:ten0313:20181012051347j:plain

これがELファイバーです。USBから給電しています。黒い大きめの部品は多分交流電圧に変換するヤーツでしょう。

作ります。

前からネオン管のサインボード、看板ですね。がほしかったんですよ。

でもあれってガラス管ですし割れたら怖いし何より結構値が貼ります。なので今回入所したELファイバーでネオン看板風のやつを作ることにしました。

f:id:ten0313:20181012051502j:plain

ちなみにELファイバー、光るとこんな感じです。明るい環境で撮影したので光度がわかりにくいですが、けっこうはっきりと蛍光色っぽい青みに色づいて輝いています。

f:id:ten0313:20181012051629j:plain

新宿の東急ハンズで黒いボードを買ってきました。別にどんな板でもいいと思います。適当に500円位で買いました。

f:id:ten0313:20181012051737j:plain

どんな文字で光らせるかを下書きします。僕は文字にしましたが、そこまで複雑なやつじゃなければ絵っぽい何かでも良さそうです。

f:id:ten0313:20181012051858j:plain

いい感じに穴を開けて(柔らかいスチレンボードっぽい板を使ったので穴あけは楽でした。それどころか柔らかいので穴同士が近すぎると穴が繋がって破損しそうだったので複雑なモチーフを作りたかったら丈夫めの板を選んだほうが良さそうです。低発泡塩ビ板とかどうよ)

f:id:ten0313:20181012052116j:plain

編み込む...というかELファイバーを通していきます。簡単簡単。

これで完成です。

f:id:ten0313:20181012052221j:plain

めっちゃいい感じでよきですね〜

文字は”WHAT IF”、深い意味はありません。それっぽいので...。

光らせてみます。

f:id:ten0313:20181012052344j:plain

あ〜〜、いいかんじ〜。

ついでに僕のベッドにも飾ってみました。

f:id:ten0313:20181012052428j:plain

これインスタ映えってやつでは!?!?!?!?!?!?1

ちなみに隣のカレンダーみたいなのは

使わなくなったタブレットを再利用してスマートミラーをつくる - 自由研究をします。

これで作ったスマートミラーです。暗いところのほうがやっぱりかっこいいですね。

まとめ

え、チョー良くないですか? 作るのにかかった費用は板が500円ELファイバーが500円あと飾るためにぶら下げるときに使った金具がだいたい500円でまあ1500円と少しでたくさん遊べました。

今回使ったELファイバーの長さは3mでしたが、このサインボードを作っても一尺くら余るほどだったのでもう少し長いのを買って(5mとか)なにかのキャラのモチーフとか形作ってもかっこいいかもしれませんね。

 

それでは

 

おすすめの記事です。

一から作ってみた、アイデア投稿の投稿、閲覧を目的としたWebサービスを作りました。

ten0313.hateblo.jp

 

ツイ廃によるツイ廃のツイ廃のためのtwitterリマインドbotを作りました。

ten0313.hateblo.jp

 

ばいばい

 

[ この記事はブログ投稿者の憶測や考えによりつくられています。

よって書いてある内容に誤りや言い間違いがあるかもしれません。もし修正したほうがいい場所や「こういった言い方のほうが”ソレっぽい”よ」などがありましたら後に記載してあります、リンク先のツイッターアカウントに教えてくださると嬉しいです:) ]

 

twitter.com

nodeの勉強がてらツイ廃のためのくっっそ便利なリマインドbotをつくった

このまえ僕が作ったアイデアサイト「 HUKIDAME」にこんなアイデアの投稿がありました。

https://hukidame-idea.sakura.ne.jp/HUKIDAME/orig_idea/11538313222.cgi

f:id:ten0313:20181011001759p:plain

僕の周りでも夜中のツイッタータイムラインで「明日〜〜やらないといけないの誰か言って」って中高生がつぶやいてるのをみるのは珍しくないですし、作ってみようと思いました。

つくりました。

やったことはtwitterAPIを利用してNode.jsでアレコレした感じです。

処理としてはタイムラインの"@reminder_fever"が含まれてあるツイートを監視してそのツイート内容を取得、取得時間とツイートに書いてある指示された時刻をUNIX時刻に変換して比較して何秒後にツイートで指定された時刻が来るか計算して、その間処理を止めているって感じです。(こういうのって説明すればするほどわけがわからなくなりますね)

 

処理の待機にsetTimeOut関数を利用しているのですが、この関数って待機時間は完全に他の処理を止めているって認識していたので誰かがリマインド機能を使用中は他の人が機能を使うのって無理...って思ってたんですけど、なんか上手くイケてますね。複数の依頼というかリマインダーを同時にこなせてます。公式のsetTimeout関数についてのやつを読んでもいまいち理解できず...って感じでした。

twitter.com

問題:サーバー環境について

普通に今問題が起こっています。サーバーのやつです。

Herokuでアレコレするといいよって教えてくれたので(そういうのさっぱりでそれ関係のQiitaとか読んでもイマイチピンとこない語句ばかりでだめですね。それらへんとか勉強する必要のやつがありそうです)じゃあそれで、ってかんじで友人に完全に手伝ってもらいながらHerokuで動かしてみたのですがsetTimeout関数が環境の相性に悪いのか一切動作しません。

とりあえず動作させておきたいと思っているので苦肉の策として僕のThinkPad上で動かしているのですが、やはり不安定です。

最悪無理そうだったらRasPiをもうサーバー代わりに使おうかなとか思っています。そこまでアクセスされることもないでしょうし負荷も大きいわけでもないのでイケるかな...なんて考えています。

このボットについて

これ最後に書くのはおかしいと思ったのですが、ふと「あれ、肝心のボットの説明してなくね?」って思ったのでもう最後に書いちゃおうかと思います。

このボットのやることは単純です。

ユーザがリプライで「あのね 10:11:20:00 洗濯物をとりこむ」(”あのね”と時間指定部分と要件はそれぞれ半角スペースで区切ってください。それと時間指定の数字は半角でお願いします)とかリプライを送ると

 ボットのほうがリマインド機能の依頼を受理したメッセージを返してきます。

 そして指定した6時20分になることでボットから再度指定したメッセージが送信されてリマインド機能の完了って感じになっています。

 

随分朝の早い洗濯物の取り込みですが、朝の早いこの人はこれで洗濯物を取り込むのを忘れずに済んだことでしょう。

このボットのヘッダー画像にも書いていますが、皆さん忘れ物をすることはあってもtwitterを開くのは絶対に忘れないですよね。

f:id:ten0313:20181011062224p:plain

だからこそツイッターのタイムライン上で「明日〜〜しなきゃいけないの私に言って」とか自分のTwitterでの名前を忘れてはいけないことの事柄にしたりして忘れないようにするのだと思います。

実際かなり有用な手だと思いますしだからこそ僕はこのボットを作りました。

忘れっぽいツイ廃のあなたに活用してほしいなと思っています。

まとめ

ボット作りたのじい〜〜〜〜って言いながら実装していました。ダラダラしたいつもの開発より結構スピーディに完成(幻滅にはまだ問題などがあり完成とは言えないかもしれませんが)したので、良いのではないかななんて思っています。

なにが良かったんだろ...ダラダラしてたのはしていたのでずっとやることにコミットしたのがよかった点です!とは言えないしなあ...。

ボットですが、とりあえずはこのサーバー問題の解決を急ぎたいです。

というかそれが目下のところ目の上のコブって感じですね。目下なのに目の上wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwはい

これが一段落ついたので次は久しぶりにハードの方に取り組みたいななんて思っています。PICやらマイコンのやつに手を出したい。

ちなみに一番最後なので告白するんですけど、HUKIDAMEに今回のボットのアイデアを投稿したのはもちろん僕です。

ばいばい

 

りまいんどくんのツイッターアカウントです。FF関係じゃないと反応できないのでフォローしたほうがいいです。

twitter.com

 

[ この記事はブログ投稿者の憶測や考えによりつくられています。

よって書いてある内容に誤りや言い間違いがあるかもしれません。もし修正したほうがいい場所や「こういった言い方のほうが”ソレっぽい”よ」などがありましたら後に記載してあります、リンク先のツイッターアカウントに教えてくださると嬉しいです:) ]

 

twitter.com

アイデアの投稿サイトを作りました

タイトルのとおりです。

作ったんですよ

アイデア投稿サイト「HUKIDAME」

何かサービスを作るときって「ニーズがあるか」つまりそのサービスを必要としている人がいるかってことを考えなきゃいけないと思うんですけど、その点に関してこのサービスは完全に「ニーズがあるか」の条件を満たしていますよね。

何か制作物を作っているときに他の制作物のいいアイデアが思いついちゃって、そっちのほうが魅力的に思えちゃって今やってることを投げ出したくなることってありませんか?

僕はあります。ヒト一人が作れるものって限界があると思いますしマルチタスクで結局作品が完成しないなんてこともあると思います。

そこでこのサイトを作りました。

f:id:ten0313:20180925224821p:plain

HUKIDAMEの目指すこと

目指すこと...というか正直たくさんの人に作ってもらいたい〜〜!って強い願望は正直そこまでって感じです。もちろん使ってもらえたら嬉しいですしデザインやシステム含めてどんどん改善を重ねていくつもりです。

 

まあでも最悪誰にも使ってもらえなくても僕の画期的で面白い発案とかを置いておく場所にしておこうかな〜とか思ってます。

今、HUKIDAMEでできること

公開しているHUKIDAMEですが、まあ正直完成形だとは思ってないです。

でもまあこの世で一番このサービスを必要としてるのは僕自身だし早く使いたいので(実はこのサイトを作っている途中でも他にやりたいことが出てきてうずうずしていた)公開して様々な人に見てもらおうと思った次第です。

いまこのサイトに作られている機能は

  • イデアの投稿(タイトル、内容、ジャンル、画像)
  • イデアの個別ページの表示
  • 各アイデアのジャンルごとのソート機能

が見てほしい機能たちです。

やったこと

PerlCGIをなんやらかんやらして書きました。

僕が書いたコードの中では比較的規模の大きい成果物になっているんじゃないかなって思っています。

 

どういうサイトなのか

文字通りなんですけど「ふと思いついたアイデア」「こんなものを作ってみたい」とか「こんなものがあったらな」とかのアイデアを投稿してもらってみんなで共有しようって目的のサイトです。

もちろん実現できるかできないかとかは関係なしですし既出のアイデアだろうが誰かにこんなもの作って欲しいとかでも構わないです。

 

「なにか思いついたからHUKIDAMEでアウトプットしてみよう」「何か面白いアイデアないかな、HUKIDAMEを漁ってみよう」

こんな思いが交差して「アイデアの放出」と「アイデアの獲得」が行われるととても嬉しいです。

まとめ

別にこれを脆弱性だとか不完全なことの免罪符にするつもりはないんですけど、このHUKIDAMEはこれからも修繕だとか機能の追加をしていくつもりです。

あとボク自身もめちゃくちゃ投稿していこうとも思っています。

 

よかったらみんなにもこのサイト教えてあげてね〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜ばいばい

 

hukidame.com これがHUKIDAMEです。

 

[ この記事はブログ投稿者の憶測や考えによりつくられています。

よって書いてある内容に誤りや言い間違いがあるかもしれません。もし修正したほうがいい場所や「こういった言い方のほうが”ソレっぽい”よ」などがありましたら後に記載してあります、リンク先のツイッターアカウントに教えてくださると嬉しいです:) ]

 

twitter.com

使わなくなったタブレットを再利用してスマートミラーをつくる

使わなくなったタブレットがあるんですよ。

なのでこれを使ってスマートミラーを作ろうと思います。

使わなくなったのを使って〜って言うとなんだかエコっぽいですね。

いらなくなったタブレットNexus7です。タブレットマイコンのプログラミングができると聞いて中古品をアマゾンで4000円くらいで買ったやつなんですけど、あまりにもおもすぎて(あと、バッテリーが死んでて充電コードを挿しっぱにしないと2時間と保たない)ほったらかしてたんですよね。

これを使っていきます。

方法

ハーフミラーってあるじゃないですか。

 

暗いところから見ると向こうが見えて、明るいところから通してみると鏡のように光を反射して見えるので向こう側が見えないってかんじのやつです。

この特性を活かし、ガラスの内側に黒背景で白い明るい文字でタブレットに表示させると黒い部分は鏡になり、白い文字は表示されるのでマジックミラーになるらしいです。

ガラスに貼るタイプのシートがあるのでそれを活用します。

 

完成したミラーには

  • 現在時刻
  • 日時
  • カレンダー

を表示させようとおもいます。

 

そのためにタブレットにはこれらを映さなければいけないですね。

Androidアプリを作ることも考えたのですが、下手に重くなっちゃうとこのタブレットでは起動すらできるかわからないのでWebページを全画面表示するってやり方でいきます。

 

作ります

 

Habitというブラウザ表示アプリがあるのですが、それを使うことで検索バー、ホームボタン、ページバックボタンなどを表示させることなく全画面でブラウザを映し出すことができるようになります。

f:id:ten0313:20180917035659j:plain

適当に表示させてみました。右下に邪魔っけなのはありますが僕のアプリを駆使する能力ではこれの非表示の方法がわかりませんでした。

コードを書きました

PerlCGIでなんやらかんやらで書きました。

f:id:ten0313:20180917035702j:plain

よきですね。黒背景に白でいいかんじです。

HTMLのhead部分で5秒毎に更新するようにしてPerlのlocaltime関数で得たデータをもとに色々しています。

ミラー部分です

f:id:ten0313:20180917035649j:plain

貼るだけでマジックミラーのあれです。これを額縁のガラスに貼ってやります。

f:id:ten0313:20180917035654j:plain

台紙のダンボールにタブレットが収まるようにカット、充電のコードがさせるようにもカットしておきます。

f:id:ten0313:20180917035652j:plain

いいでしょ

完成です

f:id:ten0313:20180917052059j:plain

よいでしょー!シートを貼る才能がなかったせいで気泡が入りまくりなのは否めませんが正直気になるので業者に貼り直してもらうかマジックミラーだけ外注するか考えています。

f:id:ten0313:20180917035646j:plain

でもちゃんと反射してます。

 

まとめ

機能の説明してませんでしたね。

上から順に、日、曜日、時刻、その月のカレンダーです。カレンダーはその日がマークされるようになってます。

これからですが、他にもその日の天気とか気温とか色々できるように今後はしていくつもりです。

もちろん動かすこともできるので未来感というか何というか

 

ミラーい感ってね

 

[ この記事はブログ投稿者の憶測や考えによりつくられています。

よって書いてある内容に誤りや言い間違いがあるかもしれません。もし修正したほうがいい場所や「こういった言い方のほうが”ソレっぽい”よ」などがありましたら後に記載してあります、リンク先のツイッターアカウントに教えてくださると嬉しいです:) ]

 

twitter.com