Web デザインツールとしてのシェアは、すでに Photoshop より Figma が圧倒的主流になっているようですね。弊社でも Figma デザインを使ってコーディングする機会が増えてきており、その過程でいくつか気づいたこと、調べたことなどがありました。 その覚書として、コーダーが知っておくべき Figma の使い方や経験則に基づくオススメについて書いていきます。 作業環境Figma はブラウザでも作業可能ですが、ちょっとだけ動作の重さが気になりました。デザインの確認程
みなさま、こんにちは。 エイトビーでは仕事で出会ったご縁を活かし、定期的に外部講師を招いて、講演会を開いています。 先日6月にはエイトビーと10年来の付き合いのある「株式会社Dooox 久保寺さん」に講演会をおこなっていただきましたので、私の所感も交えてご紹介します。 ドラマのようなヒストリーと人生訓久保寺さんは岐阜県出身。ドラゴン桜というドラマを見て、東大を受けようと思い、受けてみたら受かって東京へーーーそこから全てが始まったようです。まさにドラマのようなヒストリーでした
Webデザインの可能性を広げる生成（ジェネレーティブ）AI AI技術の進化により、Webデザインの世界も大きく変わりつつあります。特に、Photoshopに搭載された生成AI機能「Adobe Firefly」は、Webデザイナーにとって非常に強力なツールとなっています。 「Adobe Firefly」とはAdobe Fireflyは、Adobeが提供する画像生成やテキストエフェクト機能を中心としたジェネレーティブAIです。 クリエイターにとって、「こんな素材が欲しい」と思
「人はなぜ、そのデザインに惹かれるのか？」 Webデザインは、単なる見た目ではありません。それは、ユーザーの心を捉え、行動を促すための仕掛けが重要になってきます。その鍵となるのが、人間の心理を読み解く科学、「認知心理学」です。 「認知心理学」の知見をWebデザインに活かすことで、ユーザーの心理に働きかけ、驚くべき結果を生み出すことができます。 具体的な事例を交えながら、ユーザーの心理を理解したWebデザインの重要性と、その秘訣を解き明かしましょう。 ■前回の記事はこちら
「人はなぜ、そのボタンをクリックしたのか？」 Webデザインは、単に見た目を美しくするだけではありません。ユーザーの心理を理解し、行動を促すための重要な役割を担っています。そして、その鍵となるのが「認知心理学」です。 認知心理学の知見をWebデザインに応用することで、ユーザーの心理に働きかける効果的なデザインを実現することができます。 今回も具体的な事例を交えながら、ユーザーの心理を理解したWebデザインの重要性についてご紹介します。 ■前回の記事はこちら 認知心理学とは
エイトビーという会社は、風通しが良く自由な社風です。そんなエイトビーは、海外好きなメンバーが多いことも特徴のひとつ。彼らが選ぶ、イチ押しの国を5つ紹介します。これらの国々は、エイトビーのメンバーが特に愛し、心からおすすめする場所です。どれもが独自の魅力に溢れ、旅行好きなら一度は訪れたいと思わせるでしょう。では、さっそくその国々を紹介していきます。 【ハワイ】とにかく空気がイイ！幸せな気持ちになれる国！byコンドウハワイ、その名を聞くだけで心がウキウキと躍ります。飛行機から降
【CSS / JS】 今後のスムーススクロールについての続きです。 「便利になったなぁ」と満足感を感じながら実案件で前回のコードを使ってみたのですが、ブラウザチェックの際に不具合がみつかりました。 原因の調査と対応策を考えました。 不具合とは不具合の詳細 今回の不具合は、Mac の Safariで発生しました。 内容は目的の場所に移動しないことです。 原因の調査 $('a[href^="#"]').on('click', function () { const
未経験でWebディレクターを目指そうと思っている、 またはWebディレクターという職種が気になっている方へ。 少しでも私の経験が転職への後押しになればと思い、お話します。 個人的な意見も含まれていますので、ご了承ください。 Webディレクターになろうと思ったきっかけ ●これからは紙ではなくWebの時代！ 前々からWebの時代と言われていましたが、前職までのクリエイティブの仕事は気に入ってました。印刷、空間、デジタルと一通り携わりましたが、前職が特にWebに弱く、自分の中で
映画の視聴、ディナーの予約、日用品の購入、就職活動、仕事のミーティング。 日常のあらゆることがPCやスマホひとつでデジタル社会の昨今だが、そんなデジタル社会の基盤はwebサイトだ。 そしてwebサイトを構築する上で必要なポジションのひとつである「webディレクター」 一体どんな生業なのか。 その実態を探るべく、今回は在宅で働くwebディレクターの一日に密着したので、その模様を紹介しようと思う。 webディレクターフクイサダトモの拠点は東京某所の自宅だ。 以前は名古屋のオフィ
魅力的なデザインに仕上がっていても、「使いにくい」サイトになっていることはありませんか？ Webデザインは見た目だけでなくユーザーの使いやすさも重要です。引き続き、今回もユーザーにとって使いやすいデザインを制作する際の、論理的思考と無意識の心理効果について、「認知心理学」を解説しながら、デザインに応用する際のポイントをいくつかご紹介します。 ■前回の記事はこちら 認知心理学とは認知心理学ではユーザーの視覚認知、記憶、思考、判断、行動など、ユーザーが無意識的に何かを感じ取っ
この記事では一昔前の方法にも触れつつ、なんとなくやっていた『フレックスボックス、グリッドレイアウトの使い分け』を改めて文章にしてみようと思いました。 昔の手法float で横に並べる 最近はあまり使わなくなった手法ですが、一昔前のサイトの修正などで見かけることはあるかもしれません。 float とは、『 要素を指定の方向に浮かせる』プロパティです。多少不具合はあったのですが IE6 でも使え、長らく横並びはこれが主流でした。 display で横に並べる displa
魅力的なデザインに仕上がっていても、「使いにくい」サイトになっていることはありませんか？ Webデザインは見た目だけでなくユーザーの使いやすさも重要です。前回に引き続き、今回もユーザーにとって使いやすいデザインを制作する際の、論理的思考と無意識の心理効果について、「認知心理学」を解説しながら、デザインに応用する際のポイントをいくつかご紹介します。 ■前回の記事はこちら 認知心理学とは認知心理学ではユーザーの視覚認知、記憶、思考、判断、行動など、ユーザーが無意識的に何かを感
ページ内のアンカーに飛ぶ際、シュルシュルーと画面がスクロールして目的の場所までスクロールしてくれる『スムーススクロール』は色んなサイトで使われているのでよく目にすると思います。 従来の実装は JavaScript でしていたわけですが、CSS だけでも実装できるようになったようです。 html { scroll-behavior: smooth;} 少し前から知ってはいたのですが、クロスブラウザ対応を考慮するとSafari とIE に未対応なので実務には使えないも
子育てって本当に楽しいけど、やっぱりもの凄く大変ですよね。 子供中心のライフスタイルに変わり、仕事・プライベート問わず考え方が大きく変わることも。 子育てを機に転職を考えるママ・パパも多いのではないでしょうか？ 今回はそんなママ・パパの就職、転職先としてWeb業界ってどうなの？ という疑問に答えるべく、絶賛子育て中の現役Webディレクターが実態をご紹介します。 子育て世代はもちろん、まだ独身の方も今後関係することかもしれないので、ぜひ参考にしてみてください！ Web業界は在
ステキなデザインに仕上がっていても、「使いにくい」サイトになっていることはありませんか？ Webデザインは見た目だけでなくユーザーの使いやすさも重要です。今回はユーザーにとって使いやすいデザインをする際に考慮している、論理的思考と無意識の心理効果について、「認知心理学」を解説しながら、デザインに応用する際のポイントをいくつかご紹介します。 認知心理学とは認知心理学ではユーザーの視覚認知、記憶、思考、判断、行動など、さまざまな要素が研究されています。これらの要素を理解すること
MacというPC。 なにかこうキラキラした都会的な印象はないだろうか。 おしゃれでカッコいい感じ。 陰キャがそんなものを使っても許されるのだろか。 私はこれまでWindowsしか使ったことがなかった。 中学生の頃ノートPC（WindowsME）を買ってもらってから、高校生でDellのPC（WindowsXP）を通販で、大学生のころ自作PC（WindowsXP）を、社会人になってからはBTOでゲーミングPC（Windows7、Windows10）を購入。 すべてWindows
