2023.02.14 WEBWeb全般 超話題のAIツール ChatGPT のはじめ方(アカウントの作成から活用方法まで解説) この記事では、ローンチ(リリース)から2ヶ月でユーザ数が1億人に達し、史上最速の急成長アプリケーションソフトと話題のChatGPT(チャットジーピーティー)のアカウントの開設方法から基本的な使い方、活用方法などをお伝えします。 ChatGPTとは ChatGPTはOpenAI(※1)が開発した [...]
2023.02.10 WEBシステム開発 安全性、速度、並行性を兼ね備えた言語と、巷でうわさの「Rust」を覗いてみる(その7:参照と借用) みなさまお久しぶりです。 今回も「The Rust Programming Language」を読みながら、参照と借用についてみていきたいとおもいます。 参考 https://doc.rust-lang.org/book/ https://doc.rust-jp.rs/book-ja/ (日本 [...]
2023.02.06 WEBWebデザイン Illustratorでも塗りつぶしができる! ライブペイントツールの使い方 Illustratorには「塗りつぶし」ツールがない? Illustratorには、Photoshopのようにバケツの形をしたカーソルで線の中を塗りつぶす機能がありません。 なぜならIllustratorはベクターデータやパスを使用して描画するツールだからです。 ベクターデータについて詳しく説明 [...]
2023.01.25 WEBWebデザイン jQueryプラグイン「bxSlider」の使い方とオプションとカスタマイズまとめ(導入編) web制作を行うにあたってクライアント様からよくいただく要望の1つに、「画像を何枚か切り換えたい(スライドさせたい)」というものがあります。 「CSSだけで」、「JavaScriptも使って」等々、やり方は色々ありますが、一から仕様を考えて実装を行うのはなかなか手間がかかるもの。ご予算や納期を考え [...]
2023.01.19 WEBWeb全般 すばやく簡単にwebサイトのpx数を測ることができる、Google拡張機能「Dimensions」のご紹介 以前、ピクセル単位でサイズ計測ができる「Grid Ruler」をご紹介いたしましたが、今回はもうひとつ別のサイズ計測ができる拡張機能「Dimensions」をご紹介いたします。 ブラウザ上でガイドを表示できる!ピクセル単位でのサイズ計測ができる!Chrome拡張機能「Grid Ruler」 Ch [...]
2023.01.13 WEBシステム開発 【Vue.js】コンポーネントの基本を理解して使ってみたい 新年あけましておめでとうございます。 前回の記事「【Vue.js】ドラッグ&ドロップでアップロードした画像をプレビュー表示してみる」で初めてVue.jsに関して書いてみましたが、新年早々、Vue.jsの特徴の1つでもあるコンポーネントの基礎について学習する機会がありました。 使い回しが出来たり、そ [...]
2023.01.10 WEBWeb全般 【AI画像作成ツール】勝手に画像を作ってくれる!?CanvaのAI画像生成機能のご紹介 テキストを打ち込むだけで画像やイラストを生成してくれる、AI画像生成サービスをご存知でしょうか? 「近い将来イラストレーターの仕事がなくなるかも!?」と2022年SNSで大きな話題になりました。 この記事では、代表的なAI画像生成サービスとCanvaのAI画像生成機能の使い方について解説します。 [...]
2023.01.10 WEBシステム開発 Beyond the render hooks (return component from hooks) pattern. ~それでもReactでReact.FCを返すカスタムフックを作りたい!!~ 「ハンマーを持つ人にはすべてが釘に見える」という格言に耳が痛いと思う今日この頃です。 みなさん render hooks パターン使ってますか。 今回は記事タイトルの通り React.FC を返すカスタムフックを作りたい!! という筆者の願望を叶えるべく試行錯誤した内容をお送り [...]
2022.12.28 WEBWeb全般 作業効率を上げたい方におすすめ!スクリーンショットツール「Lightshot」の使い方(Google拡張機能) PCをよく使う人であれば、画面のスクリーンショットを撮ることはよくあるかと思います。 私もその一人で、スクリーンショットを撮った後に説明資料に添付して使用したり、指示書きをしたりすることがよくあります。 私は、使ったことのないスクリーンショットツールを見つけたらとりあえず試すようにしていましたが、 [...]
2022.12.22 WEBWebデザイン 【canvas入門】canvas要素にグラデーションのスタイルを設定しよう! 前回の記事「canvas要素の線や塗りのスタイルを変更しよう!」でcanvas要素において色の変更方法をご紹介しました。 canvas要素ではCSS等と同じく単色の色だけではなくグラデーションも設定することが可能です。今回はグラデーションの設定方法について解説していきます。 グラデーションを設定 [...]
2022.12.14 WEBシステム開発 安全性、速度、並行性を兼ね備えた言語と、巷でうわさの「Rust」を覗いてみる(その6:参照と借用) みなさまごきげんよう。 今回も「The Rust Programming Language」を読みながら、 参照と借用についてみていきたいとおもいます。 参考 https://doc.rust-lang.org/book/ https://doc.rust-jp.rs/book-ja/ (日本 [...]
2022.11.30 BUSINESS仕事効率化ツール chromeで開いたタブのURLをまとめてコピー&ペーストできる拡張機能、「Copy All Urls」の使い方 webブラウジングをしていると気が付いたらたくさんのタブを開いていることはありませんか? 著者は仕事柄、webブラウザを利用して多くのサイトを閲覧していますが、後でゆっくり確認したいページや気になったページはとりあえず残したまま、どんどん新しいタブでページを開いていく癖があります。 気が付いたらタ [...]
2022.11.28 WEBWebデザイン Illustratorで「矢印」を作る! Photoshopへのコピペ方法も解説します。 図解などを作成する際によく使われる矢印。 今回は Illustratorで様々な形の矢印の作り方をご紹介します。 シンプルな直線矢印 まずはシンプルな直線矢印から、応用として曲線矢印の作り方をご紹介していきます。 ①ペンツールで線を引きます。 始点をクリックし、[Shift]キーを押しながらマ [...]
2022.11.28 BUSINESS仕事効率化ツール Google Dictionaryという単語や語句の意味を教えてくれる拡張機能を⾒つけたので、使ってみた。 以前の記事で書いた「Google翻訳」の拡張機能と似ている「Google Dictionary」というwebサイト上にある単語や語句の意味を教えてくれる拡張機能を⾒つけたので、早速使ってみました。 以前の記事Google Chromeの拡張機能にある「Google翻訳」を使ってみたら非常に便利だ [...]
2022.11.16 WEBアクセス解析 無料でヒートマップ分析やサイトのレコーディングができる、Microsoft Clarityの使い方・導入方法 webサイトの分析を行うためにGoogleアナリティクスを使用している方は多いと思います。 しかしGoogleアナリティクスではサイトのアクセス数やユーザーの遷移、コンバージョンの経路などの確認はできますが、ユーザーが実際にどのような操作でwebサイトを使用しているかを分析するには不向きです。 ユ [...]
2022.11.15 WEBシステム開発 【Vue.js】ドラッグ&ドロップでアップロードした画像をプレビュー表示してみる 最近、 input type=”file” を使った画像をアップロードと、アップロードした画像のプレビューを実装する機会がありました。 そこで今後のために、 input type=”file” だけでなく、ドラ [...]
2022.11.14 WEBシステム開発 Visually Hiddenパターンでアクセシビリティに配慮したマークアップを意識する React Testing Library や Chrome の開発者ツールでアクセシビリティツリーが見えるようになるなど、最近はただ見た目通りにマークアップするだけではなく、アクセシビリティに配慮したマークアップも必要なスキルセットになってきている流れを感じます。 筆者といえば、最近HTMLやC [...]