ウェブアプリ

バラバラになってしまったHTMLのインデントを一発で整理したい。閉じタグが漏れていないかチェックしたい。 そんなときに便利なWebツールが「Prettier」です。 これはもともと、コードエディターである「Visual Studio Code（通称：VS Code）」のプラグインとして有名なツール。しかし実はWeb版もありまして、これがとても手軽で便利なのです。 面倒なインストール作業や会員登録なども不要。VS Codeをインストールする必要すらありませんので、手軽なHTMLチェッカーとして活用してみてく ...

クライアントから「ご都合の良い日程を教えてください」といただく。Googleカレンダーから、社内の関係メンバーの予定を確認し、空いているところを列挙する。 候補日を以下の通りご連絡いたします。ご都合のよい日時で、1時間ほどお時間をいただけますでしょうか。 ・8月24日（火）　14:00〜16:00 ・8月25日（水）　11:00〜15:00 ・8月26日（木）　12:00〜13:00 / 16:00〜17:00 別に大した手間ではないのかもしれないが、この「日付と時間をキーボードで打ち込んでいく」という作 ...

Webサイトの制作プロジェクトを進めていく中で、公開日時が近くなると、細かい修正対応などが増えてきます。Backlogのチケットで対応するほどのものでもない軽微な修正です。 「原稿の一部を変更したい」 「MTの操作でわからないところがあるので教えてほしい」 「写真がちょっと暗いので修正してほしい」 こうした小さな修正は、後回しにし続けると膨大な量になりがちで、しかも忘れ去られる可能性もあります。 なので課題が発生するたびに、Googleスプレッドシートの行に追加。記入者や課題内容、修正状況や優先順位を記載 ...

画像の品質を落とさず、ファイルサイズだけを落とすツール。いわゆる「画像圧縮ツール」と呼ばれるものです。 いろいろ種類はあるのですが、どれも「ちょっと惜しい」ものばかり。これが一番いい！と言い切れるものがありませんでした。 しかし今回出会った「あっしゅくま」というサービス。これは文句なしに「最高だ！」といえるツールだったので、紹介せずにはおられず、筆を執ったしだいです。 画像圧縮ツール あっしゅくま 「あっしゅくま」はJPEGやPNGの画像を軽量化するブラウザ上で使えるフリーの画像圧縮ツールです。ローカルで ...

Glideにて、複数の属性（カテゴリー）を持っている項目同士の情報を相互にリンクさせる方法が、ようやくわかったのでシェアします。 つまり、以下のような感じ。 「田中」は「野球部」にも「サッカー部」にも所属していて、「野球部」には「田中」と「佐藤」が在籍している。 「生徒の詳細」ページでは所属している部活が複数表示されてほしいし、「部活の詳細」ページでは在籍している部員が複数表示されて欲しい。 こんな感じで、各項目が相互に関係していて、しかもそれが互いに複数のカテゴリーに属しているような関係性をリンクする方 ...

ノーコードツールであるGlideを使って制作されたアプリの事例を集めてみました。ご自身で作る際の参考にしてみてください。 それぞれのアプリについて、私の考えやコメントも付けていますので、合わせてお役に立てば幸いです。 図書管理 図書管理 図書館利用アプリケーションです。 アプリ自体はシンプルで、書籍情報がまとめられているアプリです。 特徴はGAS（Google Apps Script）との連携。図書情報が自動化されていて、管理者は自分で入力する必要がありません。 図書に必ず割り振られる「ISBN」を入力す ...

企業が自社のビジネスアプリを作ろうと考えたら、もちろん失敗はしたくないですよね。予算も時間も限られてますから、当然です。 ではどうすれば、リスクを最小限にビジネスアプリを成功させることができるでしょうか。そのためには「小さく始めること」が重要です。

私はWebディレクターとして日々業務をこなしているわけだが、その中で特に使用頻度の高いITツールをまとめてみた。 プロジェクト管理・オンラインストレージ・コミュニケーションなど、種類別にカテゴライズしてある。現役でWebディレクターをしている方々の参考になれたらうれしい。

最近のスマートフォンのカメラは性能が抜群に良くなって、日常的に写真をバシャバシャ撮る人も多いでしょう。 その結果、スマホの容量がすぐにパンパンになってしまう。あるいは人に送りたいときに、重くて時間がかかる。そういったトラブルもあるでしょう。 そういったとき、ウェブアプリ「Squoosh」を使えば、画質を極力落とすことなく、画像の容量だけを減らすことができます。 Squoosh Compress and compare images with different codecs, right in your ...

写真や画像は、大サイズで綺麗なのは嬉しいのですが、それが弊害になるケースも多々あります。 「ウェブサイトにアップしたらページの表示速度が遅くなった」「写真を人に送ろうとしたら、えらい時間がかかった」など、大きな画像はそれだけ多くの通信を必要とします。 そこで活用したいのが「画像圧縮ツール」です。画像の品質を極力落とさずに、容量だけを落としてくれるツール。 なかでもGoogleが提供している画像圧縮ツール「Squoosh（スクオッシュ）」は非常に優秀で、他のアプリよりも便利な点が多いのでオススメです。

今まで数々のテキストエディタを利用してきましたが、こんなテキストエディタは始めてです。 タイトルでお話しした通り、これは「木から枝葉が伸びるように、思考と文章が拡散しつづけるテキストエディタ」なのです。 その名も「Tree（ツリー）」。無料で使えるウェブアプリケーションです。 Tree - ツリー状に書く、マークダウンドキュメント。 ツリー状に書く、マークダウンドキュメント。 テキストエディタ「Tree」とは 「Tree（ツリー）」は、ウェブブラウザで使えるテキストエディタ。いわゆる文章を書くためのツール ...

Gmail、Slack、Googleカレンダー、Backlog、Dropbox、Notionなど、仕事で使うウェブツールは数しれず。 くわえて、GmailやDropboxなどは「仕事用」と「プライベート用」、SlackやBacklogは「案件単位」でなど、複数のアカウントを活用している状況です。 これらのウェブツールは専用のアプリがあったりしますが、いちいち入れ替えたり、アカウントを切り替えたりするのは面倒です。 そこで私が愛用しているのが「Biscuit（ビスケット）」というブラウザアプリ。 複数のウェ ...

撮影した写真や画像などで、フォーカスのあたっている被写体を残して背景を切り抜きたいとき、Photoshopなどのデザインソフトを利用するのが一般的です。 しかしこの切り抜き作業というのは根気との勝負。細かい毛や髪などを丁寧にやろうと思えばい思うほど、時間と労力が掛かるものです。 今日ご紹介するのは、ウェブサービスの「removebg」。画像をアップロードするだけで、自動的に背景を切り抜き、削除してくれる優れたツールです。 驚くべきはその精度で、人物や動物などでも、毛先などをキレイに切り取ってくれます。サク ...

オフラインの状態で Google Chrome（くろーむ） を開くと以下のような画面になります。この状態でスペースキーを押すと、そのまま「恐竜ジャンプスクロールアクション：Dino Game」が始まります。 これをiPhoneのウェブアプリとして遊ぶことができます！以下のストアでウェブページを開くだけで、アプリのインストールなどは不要。お手軽にできますので、暇つぶしにどうぞ。 Appscope Appscope is a directory of Progressive Web Apps, showcas ...

ウェブサイトの制作にあたっては、SVG形式の画像ファイルが必要になるケースも増えてきた。しかしぼくはPhotoshopやIllustratorを持っていないため、アプリを使って自作することができない。 そこで活用しているのが、PNGやJPEG形式の画像をSVG形式に変換してくれるウェブサービス「vectorizer」だ。 Online Image Vectorizer Online raster to vector converter. Convert your images (jpeg, jpg or ...

こだわりはじめると、どこまでも追求したくなるテキストエディタの世界。 MacやiPhoneにインストールする、アプリタイプのテキストエディタも良いですが、最近ぼくが愛用しているのが、ブラウザ上で使えるテキストエディタです。 最近だとDropboxの「Paper」や、Googleドライブ内で使える「Googleドキュメント」なども、同タイプの「ブラウザ上で使えるテキストエディタ」ですが、個人的におすすめしたいのが「HackMD」というウェブアプリ。 リンク：HackMD - Collaborative ma ...