エイトビー株式会社

web制作会社エイトビー。 制作のプロが実際に使用している技術を発信していきます。 \…

エイトビー株式会社

web制作会社エイトビー。 制作のプロが実際に使用している技術を発信していきます。 \採用も募集中!/ 社員の声を通してエイトビーの実態もご紹介します! コーポレートサイト:https://8be.co.jp/|採用サイト:https://recruit.8be.co.jp/

最近の記事

【CSS】 フレックスボックスとグリッドレイアウトについて改めて考えてみる

この記事では一昔前の方法にも触れつつ、なんとなくやっていた『フレックスボックス、グリッドレイアウトの使い分け』を改めて文章にしてみようと思いました。 昔の手法float で横に並べる 最近はあまり使わなくなった手法ですが、一昔前のサイトの修正などで見かけることはあるかもしれません。 float とは、『 要素を指定の方向に浮かせる』プロパティです。多少不具合はあったのですが IE6 でも使え、長らく横並びはこれが主流でした。 display で横に並べる displa

    • 【Webデザイン】 “第2回” 「認知心理学」でデザインをより効果的に!ユーザーを惹きつけるデザインの秘訣 

      魅力的なデザインに仕上がっていても、「使いにくい」サイトになっていることはありませんか? Webデザインは見た目だけでなくユーザーの使いやすさも重要です。前回に引き続き、今回もユーザーにとって使いやすいデザインを制作する際の、論理的思考と無意識の心理効果について、「認知心理学」を解説しながら、デザインに応用する際のポイントをいくつかご紹介します。 ■前回の記事はこちら 認知心理学とは認知心理学ではユーザーの視覚認知、記憶、思考、判断、行動など、ユーザーが無意識的に何かを感

      • 【CSS / JS】 今後のスムーススクロールについて

        ページ内のアンカーに飛ぶ際、シュルシュルーと画面がスクロールして目的の場所までスクロールしてくれる『スムーススクロール』は色んなサイトで使われているのでよく目にすると思います。 従来の実装は JavaScript でしていたわけですが、CSS だけでも実装できるようになったようです。 html { scroll-behavior: smooth;} 少し前から知ってはいたのですが、クロスブラウザ対応を考慮するとSafari とIE に未対応なので実務には使えないも

        • Web業界は子育てママ、パパ向き!?在宅&子育て中のWebディレクターの実情

          子育てって本当に楽しいけど、やっぱりもの凄く大変ですよね。 子供中心のライフスタイルに変わり、仕事・プライベート問わず考え方が大きく変わることも。 子育てを機に転職を考えるママ・パパも多いのではないでしょうか? 今回はそんなママ・パパの就職、転職先としてWeb業界ってどうなの? という疑問に答えるべく、絶賛子育て中の現役Webディレクターが実態をご紹介します。 子育て世代はもちろん、まだ独身の方も今後関係することかもしれないので、ぜひ参考にしてみてください! Web業界は在

        【CSS】 フレックスボックスとグリッドレイアウトについて改めて考えてみる

          【Webデザイン】 “第1回” 「認知心理学」でデザインをより効果的に!ユーザーを惹きつけるデザインの秘訣 

          ステキなデザインに仕上がっていても、「使いにくい」サイトになっていることはありませんか? Webデザインは見た目だけでなくユーザーの使いやすさも重要です。今回はユーザーにとって使いやすいデザインをする際に考慮している、論理的思考と無意識の心理効果について、「認知心理学」を解説しながら、デザインに応用する際のポイントをいくつかご紹介します。 認知心理学とは認知心理学ではユーザーの視覚認知、記憶、思考、判断、行動など、さまざまな要素が研究されています。これらの要素を理解すること

          【Webデザイン】 “第1回” 「認知心理学」でデザインをより効果的に!ユーザーを惹きつけるデザインの秘訣 

          Windowsしか使ったことがないコーダーがMacに乗り換えた話

          MacというPC。 なにかこうキラキラした都会的な印象はないだろうか。 おしゃれでカッコいい感じ。 陰キャがそんなものを使っても許されるのだろか。 私はこれまでWindowsしか使ったことがなかった。 中学生の頃ノートPC(WindowsME)を買ってもらってから、高校生でDellのPC(WindowsXP)を通販で、大学生のころ自作PC(WindowsXP)を、社会人になってからはBTOでゲーミングPC(Windows7、Windows10)を購入。 すべてWindows

          Windowsしか使ったことがないコーダーがMacに乗り換えた話

          「エイトビーってぶっちゃけどう?」中途採用で入社したバックエンドエンジニアに聞いてみた!

          web制作のにおいても必要不可欠なポジション「バックエンドエンジニア」。 でも、エンジニアからすると、webのプログラマーというのは意外とマイナー、ある意味マニアックな職種らしい。 ・webのバックエンドエンジニアって何をするの? ・エイトビーの場合、他のweb制作会社と何が違う? ・どんなところにやりがいを感じる? ・エイトビーに向いてる人って? など、新卒、転職問わずweb制作のバックエンドエンジニアに興味がある人が気になることを弊社のエンジニアに根掘り葉掘り聞いてみた。

          「エイトビーってぶっちゃけどう?」中途採用で入社したバックエンドエンジニアに聞いてみた!

          Three.jsとGSAPでスクロールアニメーションを作ってみた

          自社サイトリニューアルにあたり3Dモデルをスクロールに応じて動かすアニメーションを実装しました。 そこで自分の備忘録を兼ねて、その作り方をまとめてみます。 モデル表示にはThree.js、アニメーションにはGSAPを使用しています。 Three.jsでモデルを表示するHTMLファイルの作成 公式サイトを参考に、CDNを利用してThree.jsを読み込みます。 canvasというIDを持つ要素を用意しておきます。 <!DOCTYPE html><html lang="j

          Three.jsとGSAPでスクロールアニメーションを作ってみた

          【Webデザイン】PhotoshopとFigmaで作り比べ

          「いつかはFigma、そろそろFigma」 遅ればせながら、Figmaの波にやっと真っ向から向き合う決意をしました。 PhotoshopとWebデザイナーの道を歩んではや○年… 「どっぷりフォトショ信者のWebデザイナーがFigmaを使ってみた!」感想がこちらです。 まずは学ぶ「感覚でなんとかなるだろ〜」と、Adobe製品を触るテンションでFigmaでの制作を試みましたが、XDをすっ飛ばしてのFigmaというのもあり、その安直な姿勢は即打ち砕かれました(笑)画面構成を見て

          【Webデザイン】PhotoshopとFigmaで作り比べ

          【比較一覧】おすすめWebフォントサービス8選!

          前回の記事でWebフォントがデザインに与える印象についてお話をさせていただきました。 では実際「Webフォントにはどんな種類があるの?」ということで、紹介していきましょう。 Webフォントサービス一覧Google Fonts Googleが提供するWebフォントのサービスです。以前は日本語フォントの数は限られていましたが、ここ最近はその種類も増えてきています。何より無料で利用でき、様々な言語のフォントにも対応している点が大きな特徴です。 提供会社 Google 利用

          【比較一覧】おすすめWebフォントサービス8選!

          サイトの印象はフォントで決まる!Webフォントでサイトデザインの可能性を広げよう!

          Webサイトの印象を大きく左右するフォントは、サイトをデザインをする上でとても重要な要素となります。 近年主流になりつつある「Webフォント」を効果的に活用しながら、サイトのデザインをグッと素敵なものに底上げしましょう! この記事ではフォントが与える印象の違いを実例を交えながら、Webフォントの魅力を伝えて行きます。 デバイスフォントとWebフォントWebサイトで文字を表示させる方法は デバイスフォントを使う Webフォントを使う 2通りの方法があります。 デバイス

          サイトの印象はフォントで決まる!Webフォントでサイトデザインの可能性を広げよう!

          未経験から第二新卒でwebディレクターになった話

          webディレクター。 なんとなく肩書は格好良いけど、何をするんだろう? そもそも未経験でもwebディレクターになれるの? そんな悩みを持っている就活生や、転職を考えている人がいると聞いたので、自分の経歴を交えながら、webディレクターの実態を伝えようと思う。 webディレクターを職業に考えている人は是非参考にしてほしい。 自己紹介。 フクイサダトモ。webディレクター。7年目。32歳。 webディレクターになったのは25歳。 いわゆる第二新卒の年齢でwebディレクターになっ

          未経験から第二新卒でwebディレクターになった話