カテゴリーアーカイブ Webサービス

著者:村上

【Webサービス】日本の伝統色の一覧が載っているサイト「和色大辞典」

今日はアプリのボタン色などを決めるときに参考にさせていただいているサイト「和色大辞典」のご紹介です。
ひと口に「青」や「赤」と言っても色々あるので、こう言った色見本がずらっと並んだサイトは非常に重宝しています。
で、その中でも個人的に気に入っているのが、今回紹介する「和色大辞典」というサイトです。

サイトは下記からご確認ください。

日本の伝統色 和色大辞典 – Traditional Colors of Japan
https://www.colordic.org/w

サイトにアクセスすると、色見本がずらりと並んでいるのですが、色の名前が色々あって面白いんですよね。
中には全く聞いたこともないような名前もあって、伽羅色（きゃらいろ）とか初めて聞きました…。

また、色を選択すると、その色の配色パターンを確認することもできます。
パッと目についた「桔梗色」の配色パターンを見てみるとこんな感じ。

彩度を変更した色一覧や、明度を変更した一覧のほかに、色相環を元にした配色パターンも表示されています。
色相環の反対にある補色や、隣り合う類似色等も掲載されているので、アクセントカラーを選んだりするときにもちょうど良いですね。

こちらのサイトでは、和色の他にも洋色やパステルカラー、ビビットカラーの一覧も載っています。
また、今日のラッキーカラーなんてページもあるので、この中から色を選んでみるのも面白いかもしれません。

以上、WEB色見本のサイト「和色大辞典」のご紹介でした。
色を選ぶのって結構難しいので、こういったサイトで色の名前も含めて探してみるのも面白いと思います。

著者:村上

【Google】ハングアウトで音声が聞こえない時に確認する事

今日遭遇した機材トラブルについてです。
Web 会議でハングアウトを利用したのですが、接続先の方の音声が聞こえず、30分くらい奮闘しました。
ので、次回こうなったときの確認事項をまとめ。

公式のサポートページもありますので、基本的にはこちらを参考にすればOKです。

音声通話やビデオハングアウトの問題を解決する – ハングアウト ヘルプ
https://support.google.com/hangouts/answer/1355579?hl=ja

まず確認する事項は、マイク、スピーカーなどの機材と接続している場合はそれが ON になっているかです。
もし、PC 内臓のマイク、スピーカーを使用している場合は、それらが OFF やミュートになっていないかを確認します。
また、ハングアウト以外のプログラムでマイク、カメラ、スピーカーが使用中になってる場合、可能であれば一旦終了します。

上記を確認して問題がなかった場合は、ハングアウトの設定を確認します。
画面上に歯車アイコンがあると思うので、そちらから各種設定が正しいかを確認します。
今回はスピーカーに問題ありだったので、スピーカーの出力先を確認し、「テストサウンドを再生」します。これでスピーカーが正しく設定されているかが確認できます。

それでもだめな場合は、ハングアウトの再接続とパソコンの再起動を試してください。
また、接続先の方にも上記の確認をしてもらうと良さそうです。
ここまで確認してもトラブルが解決しないなら、相手側の問題も疑った方が良いですね。

なお、今回の場合は、どうやら接続先の方のマイクトラブルが原因だったようでした。
音声のみスマートフォンで接続していただいたら解決できました！

以上、ハングアウトで音声が聞こえない場合に確認する事の一覧でした。
参考になれば幸いです。

著者:杉浦

【GitHub】サンプルコードの付属していないライブラリのサンプルコードの探し方

　npmやらcomposerやらpipやら最近のプログラミングではパッケージマネージャを用いて簡単に外部ライブラリを扱うことができます。簡単に扱えるようにできるのですが、目的に合わせた使い方をするためには可能ならば中身。少なくとも使い方を把握する必要があります。大体は説明ドキュメントぐらいあるのですが、実際に動くサンプルコードとなるとないこともままあります。そういった時はGitHubの中を探して、すぐに動かせるサンプルコードを見つけて、動かしながら確かめます。
　GitHubの検索機能ではいくつかの単位でGitHubに存在するモノを探せます。
　見つけたいのはあるライブラリを実際に用いているプロジェクトのコードです。このためコード単位で直接ライブラリ名を打ち込むだけで近い対象がヒットします。例えば、leaflet（JavaScriptの地図用ライブラリ）なら次のようになります。

　AltJSなどの拡張言語の場合における使い方を探すならば言語指定を行います。URLのGETパラメータにl=vueなどとl={言語の代名詞（拡張子とか）}を入れると更に絞り込まれ具体的になります。

　この方法を用いるとcommit数1の様なメモ帳代わりのポジトリも見つけられ中々助かります。JavaScriptの場合、package.jsonの中を探すつもりで組み合わせたいライブラリ名とjson形式コード指定で検索するというやり方もあります。他言語でも設定ファイルで同様のことができます。

著者:takahashi

Excelなどで作成した表をMarkdown形式の表に変換できるサイト “Tables Generator”

Markdown記法は手軽にリッチな装飾ができるため、開発者を中心に人気がある記述方法です。しかし、表の記述についてはちょっと不便を感じることがあります。

Markdownでは表を記述する際、１カラムを | | で囲んで表現します。

簡単な表であれば不便を感じることはないのですが、これがカラム数が増えたりしてくると…

画像のようにエディタによっては途中で折り返してしまい、カラムの対応がわかりにくくなります。

また、データの長さがバラバラのものが入ってきても読みづらくなりますし、手動でインデントを直すとしてもデータ数が多いととっても大変です。

またExcelのように、入力完了後にEnterキーやTabキーを押しても別のセルにカーソルが移動してくれたり…といった機能も基本的には使えません。(VSCodeの場合はText Tablesというプラグインを使えばある程度はExcelっぽい操作ができるようになります。)

ということで、表はやっぱりExcelなどでサクッと作って、それをMarkdownに変換してしまった方が楽です。

ExcelからMarkdownに変換するのはいろいろ手段がありそうですが、今回はTables GeneratorのMarkdown Tables Generatorを使用します。

まずはExcelで表を作成して、全部コピーします。

次に、 左上のFileから、Paste Table Data をクリックします。

表示されたダイアログに、Excelでコピーした表をそのまま貼り付けます。

貼り付けたらLoadをクリックします。

するとこんな感じで、Markdown用の表を、インデントも揃えた形に一括変換してくれます。
後は右上の”Copy to clipboard”をクリックすればクリップボードに表がコピーされるので、

エディタに貼り付ければOKです。

インデントもいい感じですね。

ということで、Markdownで表をの是る際にお困りの方は是非試してみてください。

著者:村上

【サービス】画像を送ると文字起こししててくれるLINEアカウント「文字起こしばりぐっどくん」

とても便利なサービスを紹介している記事を見つけたので、共有＆備忘録のためにまとめ。

読んだ記事はこちらから。

LINEに画像を送ると、AIが3秒で文字起こし　「企業や役所の働き方変える」　長崎のベンチャーが開発 – ITmedia NEWS
https://www.itmedia.co.jp/news/articles/1907/11/news110.html

長崎県西海市のベンチャー企業「西海クリエイティブカンパニー」が7月3日からLINE上で公開しているサービスで、LINE アカウント「文字起こし ばりぐっどくん」です。
こちらは友達申請をするとすぐ使え、文字起こしをしたい画像を送ると、数秒でテキストを返してくれるのだとか。
手書き文字は分かりませんが、名刺などの印字されているものでしたら問題なく変換ができるとのこと。
チラシなどの紙媒体に記載されたデータの取り扱いがかなり便利になりそうですね！
また、役所などの紙を扱うことが多いお仕事ではとても役立ちそうですね。
幸い、紙データを扱うことはそこまで多くありませんが、たまに紙データからテキストを抜き出したいことがあるので、使う頻度はそこそこありそうです。

なお、こちらのサービスですが、非エンジニアの担当者の方が、約1週間で作り上げたものとのこと。
文字起こしには、Google Cloud Platform の画像認識サービス「Cloud Vision」を使用しているそうです。
面白そうなので、時間があれば是非触ってみたいですね！

以上、画像から文字を起こしてくれるLINEアカウント「文字起こし ばりぐっどくん」のご紹介でした。
いざというときに便利そうなので、この後にでも友達申請をしておこうと思います。

著者:takahashi

Web版Twitterで複数アカウントを切り替えできるようになっていた話

最近、Twitterを使っていたらある新機能が追加されていることに気づきました。

ふとサイドバーを開くとこんな表示が

ムムッ！？ なにやらプラスボタンが追加されている…!

クリックしてみると…

なんと複数アカウントでログインできるようになっていました！！！
追加するとプラスボタンがあるところに追加でログインした2つ目のアカウントのアイコンが表示され、クリックするだけで切り替えができるようになっていました。

Twitterでは用途などに応じて複数アカウント使っている方も結構多そうなのですが、現行のアプリではAndroid/iPhoneアプリしかアカウント切り替えが使用できませんでした。
PCではWeb版Twitterを使うことがほとんどだと思うので、今回のアップデートを喜んだ方も多かったのではないかなと思います。

また今回Webで複数アカウントがサポートされたことで、Web版をベースにしているPWA版のアプリでも反映されたので、Windowsアプリ版のTwitterアプリでもアカウント切り替えが復活して、また便利に使えるようになりました。

次期macOS CatalinaでもiOS版のTwitterアプリのソースを使ってmacOSアプリを作成してリリースするそうなので、それが実現すれば再び主要OSすべてで専用アプリが出そろう形になりそうです。

今後のリリースが楽しみですね。

著者:村上

【Webサービス】PDFファイルを英語から日本語に翻訳する方法

かなり便利だったので、備忘録としてまとめ。
タイトル通り、PDFファイルを英語から日本語に翻訳する方法です。

参考にさせて頂いたサイトはこちらから。

Google 翻訳の利用：PDFやWordのファイルを翻訳する方法 – 東京経済大学 TKUメール（Gmail）
http://google.tku.ac.jp/others/23/2

上のサイトで紹介されていたのは、Google 翻訳を利用する方法です。
Google 翻訳のページを開くと、下の画像のように翻訳元・翻訳後のテキストが表示されるエリアがあるかと思います。

で、いつも使わなかったので見落としていましたが、翻訳元テキストの入力欄の上に「テキスト」とは別に「ドキュメント」というボタンがあります。
こちらをクリックすると、Word や PDF、Excel ファイルなどを選択できるようになるので、こちらに翻訳したいファイルをアップロードします。
あとは「翻訳」ボタンをクリックすれば、翻訳が完了した文章がHTMLページで表示されるので、このページを保存するなり、必要な部分のみを抜き出したりするなどしてください。

以上、PDFファイルを翻訳する方法でした。
短文ならコピー＆ペーストで対応可能ですが、ファイル丸ごととなるとその方法は面倒なので、今後はこの方法を使いたいと思います。
参考になれば幸いです。