マガジン
エンジニアによるテックブログ
101 DESIGN
- 6本
イチマルイチデザインの働き方
101 DESIGN
- 1本
マーケティングにまつわること
101 DESIGN
- 1本
記事一覧
自社コーポレートサイトのアクセシビリティ向上に取り組み始めた話
こんにちは。イチマルイチデザイン株式会社でフロントエンドエンジニアをしている長谷川です。 この度、自社コーポレートサイト（https://101de-sign.com/）のアクセシビ…
自社コーポレートサイトのアクセシビリティ向上に取り組み始めた話
こんにちは。イチマルイチデザイン株式会社でフロントエンドエンジニアをしている長谷川です。
この度、自社コーポレートサイト（https://101de-sign.com/）のアクセシビリティ向上の取り組みを始めました。
今回の記事では、アクセシビリティ向上に取り組み始めた経緯や取り組み内容を、備忘録として書いています。
アクセシビリティ周りのちょっとした解説も交えていますが、がっつり解説はして
Figma おすすめアニメーション
101デザインの佐々木と申します。
前職は広告制作会社でデザイナーをしており、2021年4月に101に入社し、デザイン、ディレクション業務を行なっております。
ウェブデザインを始めた当初はXDを使用してましたが、最近はもっぱらFigmaを使用してデザインをしております。
そんな私が101に入社し覚えた、Figmaの便利なアニメーション機能についてご紹介いたします。
今回はみんな大好き「追従
Webアクセシビリティの向上に取り組むための準備
こんにちは。イチマルイチデザインでフロントエンドエンジニアを担当している長谷川です。
ここ最近、企業からのWebアクセシビリティの向上や改善といった言葉をよく目にするようになりました。
様々な活動事例を見て、誰もが利用できるWebサイトやWebサービスを作ることの大切さを感じ、これを機にWebアクセシビリティの向上に真剣に取り組んでみようと考えました。
ただ最初から、セマンティックなマークア
【Shopify】クール便など複雑な送料割引を実装する場合の対応方法
こんにちは。
イチマルイチデザイン株式会社の和田です。
私は主に、ECサイト構築ASPカートシステム「Shopify（ショッピファイ）」の構築・運用を担当しております。
このShopifyですが、2020年頃より本格的に日本国内でも導入件数が増えてきました。
豊富なデザインテンプレートや多様なアプリケーションによるカスタマイズ性の高さなど、比較的容易に本格的なECサイトを構築することが可能とな
オランダでのメディア利用の実情と変化
こんにちは。イチマルイチデザインでマーケティングを担当している松田です。
ここ数年、新型コロナウイルス感染症拡大という未曾有の事態に伴い、企業でのリモートワーク化が進みました。業種業界にはよりますが、どこでも働くことができる時代に突入していることを実感したという方も少なくないのではないしょうか。
世界が徐々に落ち着きを取り戻しつつある2021年12月、私はオランダでの生活を始めました。今回は、オラ
Mac に Yarn をインストールする
イチマルイチデザインでフロントエンドを担当している河口です。
今回は Yarn を Mac にインストールする手順を紹介します。
Yarn は js のパッケージを管理できるパッケージマネージャーです。
Node.js をインストールした際に、自動でインストールされる npm と役割は同様になります。
Command Line Tools for Xcode をインストールまずは、動作環境を整
Chakra UIとReact Hook FormとYupを使ってフォームを作成する
こんにちは。イチマルイチデザインのフロントエンドエンジニアの高橋です。
今回は、Chakra UIとReact Hook FormとYupを使用して、ユーザビリティ高めのフォームを比較的簡単に作成する方法を共有します。
使用するライブラリ実装方法こちらが実際のコードの全体像となります。
import { Button, Container, FormControl, FormErrorMes
Body scroll lockを使用して要素のスクロール固定を制御するカスタムフックを作成する
こんにちは。
イチマルイチデザインのフロントエンドエンジニアの高橋です。
今回は、Body scroll lockを使用したカスタムフックを作成して、ドロワーメニューやモーダルの展開時に、背面の要素を固定する処理を簡単かつシンプルに実装する方法を共有します。
実装方法と解説
こちらが実際のコードの全体像となります。
// useBodyScrollLock.tsimport { RefObj