ラクーン技術戦略部部長に齋藤浩平さんが就任しました
「もう大丈夫！何故って？私が部長に就任した！」 ということで、最近ヒロアカのアニメを1～6期まで一気に見た影響が色濃く出ております。齋藤です。 （元が大丈夫じゃなかったわけではないですよ） 部内では、「さい」とう「こう」へいで、「さいこう」さんなんて呼ばれてたりします。 タイトルの通り2023年5月より技術戦略部部長に就任しました。 よろしくお願いします。 就任早々色々なことに手を付け始めてバ
2023.6.16
駆け出しデザイナーに知ってほしい、コミュニケーションのコツ
今回は駆け出しデザイナーに知っておいて欲しい、デザイン制作をするうえで役立つコミュニケーションのコツをお教えしたいと思います。 私がデザイナーとして経験してきた成功や失敗がベースになっていますので、一般的に定説とされている内容とは若干違いがあるかもしれませんが参考になれば嬉しく思います！ デザイナーに求めらるコミュニケーションスキル デザイナーと聞くと表現スキルがすごい人と真っ先に想像しがちで
パスワードにさよなら？スマホ・PCで顔や指紋認証でログイン Passkey認証ができるWebサイトの作りかた
エンジニアの皆様は、ログイン機能が必要なサイトの「ログイン方法」の要件として何を思い浮かべますか？ 多くの方はID/パスワードでの認証を一番に思いつくのではないかと思います。 ID/パスワード認証はポピュラーな認証方法ですが、パスワードの漏洩からの不正アクセスのリスクや忘れてしまったときの不便さがあります。 そこで今回は、Passkey認証のできるサイトの作り方をフロントエンドの実装にフォーカスし
2023.4.28
type=”file”のinputタグをJSで操作する方法
今回は私が最近担当した案件で苦労した、type="file"のinputの値と全く同じ形式のデータを０から作る方法と、データをフォームでアップロードする方法各種について書いていこうと思います！ input type="file"について 基本的にinput type="file"の値というのは、type="text"などのほかのinput要素と違い変更したり設定したりすることはできません。 も
2023.4.26
タグマネージャでGA4を設定するときにやっておいた方が良いこと
今回はエンジニアとビジネスサイドの双方の立場から見た、GoogleタグマネージャとGA4（Google Analytics プロパティ4）のオススメ設定を紹介します。 ユニバーサルアナリティクスの終了に伴ってGA4をタグマネージャを利用して設定する方が増えていることと思います。 タグマネージャは便利なのですが、1つ問題点としてタグマネージャ経由でGA4を埋め込んだ状態で任意のイベントを記録しよう
エンジニアはスクラムマスターの夢を見るか？～なんちゃってアジャイルからの脱却とそれにまつわるアレコレ～
突然ですが、皆さんの組織ではアジャイル開発を行っていますか？ 恐らく程度の差はあれど、かなり多くの会社でアジャイル開発を少なからず取り入れた開発を行っているのではないかと思います。 でも・・・・、それ本当にアジャイル開発になっていますか？ こんな?感想が出てくる「なんちゃってアジャイル」になってしまっていませんか？ 「アジャイル開発は 納期を定めないから or 最初に要件を全て決めなくて済む
今日から書けるSass(SCSS)入門！
今回は社内でも導入され始めている、Sassについて簡単にまとめてみようと思います。 これを読めばとりあえず今日からSassの基礎的な書き方はばっちりです！ (環境構築などは今回は触れません) Sass(SCSS)とは Sassとは「Syntactically Awesome StyleSheets」の略称で、CSSの拡張言語です。 CSSをより便利に見やすく使えるようにしたようなもので、基本的
2023.4.12
今さら聞けない！社内印刷をすると余白ができる理由とは
本記事を書くきっかけ 日々社内の様々な資料や販促物を作成するインハウスデザイナーの筆者が良く言われる言葉があります。 「これフチに余白ができてしまうんだけど、余白をなくして印刷することはできますか？」 資料を会社のプリンターで印刷したり、取引先へデザインの試し刷りを依頼した際などに、似たような質問をされた経験はありませんか？ この余白というのは、紙面のフチにインクやトナーが乗らず白色のまま
CSS4の疑似クラス使ってますか？
皆さまCSS4の疑似クラス使ってますか？ 発表されたばかりの頃は対応ブラウザが少なく後回しにされがちですが、そろそろ対応ブラウザも多くなってきたので色々な疑似クラスを紹介していきたいと思います。 ちなみにCSS4という規格は存在せず、Level4のモジュールを総称してCSS4といわれています。 :has() 指定したセレクターがある場合、その親要素にスタイルを適用することができます。 ブラウザ
2023.3.31
【地味に便利】Photoshop2023の新機能
今回はPhotoshop2023版でバージョンアップされた機能についてご紹介したいと思います。 その中でも「選択機能の向上」と「ワンクリックで削除して塗りつぶし」をご紹介したいと思います。 選択機能の向上 オブジェクト選択ツールが強化されたことでより簡単に画像上の物体を選択できるようになりました。 パワーアップしたAIの力でより正確に空、水、自然の地面、植物、建物などの要素をワンクリックで選択
2023.3.29
dialogタグでセマンティックにモーダルを作成するには
新しく追加されたdialogタグの特徴に触れつつ弊社のサイトで使われているモーダルをつくってみます。 対応ブラウザ 執筆時のSafariバージョンが16.xxのため、気になるのはSafariくらいでしょうか。 ブラウザ バージョン Safari 15.4 Safari ios 15.4 Chrome 37 Firefox 98
2023.3.28
基本のcss疑似クラス:has()を振り返ってみよう！
今回は基本のcss、疑似クラス:has()について振り返ってみたいと思います。 :has()の使い方 子要素の中に指定した要素がある場合にスタイルを利かせる事ができます。 例えば以下のようなhtml,cssだと、 html <div class="hoge"> <p></p> <p></p> </div>
2023.3.28