速くて安いWebサイトを目指して作ったときのポイントです。 追記 2/20:Cloudflare Pagesの毎月の無料枠のビルド回数が誤っていたので修正しました(50→500)
速くて安いWebサイトを目指して作ったときのポイントです。 追記 2/20:Cloudflare Pagesの毎月の無料枠のビルド回数が誤っていたので修正しました(50→500)
その主な内容と、最後に私の思うところを書いていきたいと思います。 ここ最近、有名ブランドのロゴが次々とSans Serif(サンセリフ)体に変わっていき、元々あった個性やカラーまでもが無くなっていると言うものでした。また、その動きはファッションブランドから始まり、テック系企業へ波及しているとのこと。 そう言われてみれば、その通り。なんとなくロゴが洗練されたなくらいにしか思っていなかったのですが、こうしてみると多くのブランドのロゴが無個性化している。なんだか寂しい。 Sans Serif(サンセリフ)とは日本語で言うとゴシック体のようなもので、対するSerif(セリフ)とは明朝体のようなもの。「Serif」は直訳すると「飾り」ですが、書道で言う跳ねがある、より流麗な文字書体という感じでしょうか。 さらに、なんとカラーまでも無くなっているとか。テック系はまだいいのですが、ファッション系になると
K e n T a @kenta_feels_ayu 面白いのはヨドバシドットコムのUIの不器用さに反し、 JCSI(日本版顧客満足度指数)の調査で10数年連続で満足度1位を叩き出しているというデータがあることなんすよね。 (楽天Amazonもスコア60~70前半でひしめいてる中、ヨドバシは70後半ものによっては80以上のスコアを叩き出して独走状態。) pic.x.com/cK5qnma6sC x.com/List_Erine/sta… 2025-01-17 16:29:08 炭山水(旧リステ・リン) @List_Erine それはそれとして、ヨドバシドットコムはもうちょいwebサイトやアプリのUIはもうちょい頑張って欲しいではある。 ことあるごとにパスワード入力求められてウザいし、ボタンデザインが直感的でないし、住所変更がヘッダに反映されないし、検索結果がいかにもな部分一致キーワード検索
こんにちは。 苦しんでプログラミングを学んだ柴犬こと、くるしばです。 独学でプログラミングを学習し、Webサービス作りITベンチャーを起業しました。 その後個人開発したサービスを売却したり、また別のIT系の会社を創業したりしています。 下記のTwitterにてプログラミング学習に関して発信し、1.9万人以上の方々にフォローして頂きました。 また、最近はUdemyでReactとFlutterのプログラミング講座も出して、ベストセラーにも入っています。 初心者のうちは知らなかったが、学習を進めたり実務に入って経験が長くなってから 「こんな便利なものあったんだ...!」 となるツールってありませんか? 僕はめちゃくちゃありました。 こういったツールは他の詳しい人から教えてもらうケースも多いので仕方がないのですが、もしこれらを初心者のうちに知ってたら色々楽だったのにな...と思うものが沢山あります
オウンドメディアの運用は、自社だけでなく外部の制作会社にコンテンツ制作をお願いする(外注する)ケースも少なくありません。 ですが、記事制作をお願いしたものの「思い描いていたアウトプットと違う」「パートナーへ適切な指示ができているかわからない」と悩んだり不安を持ったりしたことがある人もいるのではないでしょうか。 特にオウンドメディアの担当者はライティングや編集未経験にも関わらず、記事の企画や内容をジャッジする編集長ポジションに就くこともめずらしくありません(オウンドメディアディレクターやコンテンツディレクター、といったポジションの方が記事の品質管理を担うケースもあります)。 そこで本記事では、主に編集プロダクションなどのコンテンツ制作パートナーとの適切な付き合い方の理解が深まるよう、はてなで公開中の「オウンドメディア制作パートナーとの付き合い方マニュアル」の内容を一部抜粋・編集し紹介します。
どんなものでも「良い」に越したことはありません。それはわかるんだけど、じゃあ「良くない」と何が起こるの? デザインが「良く」なるとどんな効果が得られるかはよく語られますが、デザインが「良くない」ときになにが起こるのかについて考えてみたいと思います。 今回のデザインが「良くない」は、 ・文字が読みにくい ・構成がわかりづらい ・色の使い方が無計画 といったことを指す、という前提で進めます。 人の脳には2つのシステムがあるダニエル・カーネマンは「ファスト&スロー」の中で、人間が思考し何かを決めるとき、脳ではふたつのシステムが働くとし、それぞれシステム1、システム2と呼んでいます。 特徴としては次の通りです。 興味深い実験本の中で、ABふたつのグループに対し、直感的に答えると間違えやすい引っ掛け問題を、Aグループには明瞭な印刷、Bグループには小さな文字の掠れた印刷で実施したテスト結果が紹介されて
個人的に「Webサービスの公開前チェックリスト」を作っていたのですが、けっこう育ってきたので公開します。このリストは、過去に自分がミスしたときや、情報収集する中で「明日は我が身…」と思ったときなどに個人的にメモしてきたものをまとめた内容になります。 セキュリティ 認証に関わるCookieの属性 HttpOnly属性が設定されていること XSSの緩和策 SameSite属性がLaxもしくはStrictになっていること 主にCSRF対策のため。Laxの場合、GETリクエストで更新処理を行っているエンドポイントがないか合わせて確認 Secure属性が設定されていること HTTPS通信でのみCookieが送られるように Domain属性が適切に設定されていること サブドメインにもCookieが送られる設定の場合、他のサブドメインのサイトに脆弱性があるとそこからインシデントに繋がるリスクを理解してお
日本デザインスクールでは年間1500名ほどの受講生を、未経験からWEBデザイナーに育ててきました。受講生を指導する中でよくあがってくるのが「参考がなかなか見つからない」というお悩み。 私も受講生にお伝えすべく、これまで100サイト近くの「参考になりそうなギャラリーサイト」を見てきました。 そこで今回は、これまで見てきたギャラリーサイトの中で、みなさんのデザイン制作のお役に立ちそうなサイトを全部で61個ご紹介していきます。 全てのサイトを おすすめ度 サイト内検索の可否 いいね/保存機能の有無 ランキング機能の有無 掲載サイト数 を基準にランクづけし、おすすめできるサイト順に載せているので忙しいという方は、とりあえず上から順にチェックしていただければ大丈夫です!みなさんのデザイン制作に活かしていただけると嬉しいです。 【全サイト徹底比較】超参考になるおすすめギャラリーサイトTOP38 ちょう
こんにちは!株式会社Rabeeのtotoです🐝デザイン・EC・マーケティングでの職務経験から得た、働きやすさに繋がるヒントをnoteに記していきたいと思います。 本日は「生成AI」はほぼ初めて!というWEBデザイナーの方が、業務で使える活用術をご紹介します。 まずは基本的な使い方の習得を目指しましょう! 今回は主にChatGPTを使った業務の効率化方法をお伝えします。 私が普段利用する時はTeamプランを使用していますが、無料プランでできるものを取り上げましたので、ぜひ実際に試しながら読んでみてくださいね! 1. 生成AIを使うリスクとは?はじめに、生成AIを使う上での注意点をお伝えします。 漠然とリスクを感じているために、生成AIを業務に活用できていないという方も多いのではないでしょうか。 主にどのようなリスクがあるのかを把握し、何に注意をすれば良いのかを知りましょう。 1. データの
ウェブサイト制作では、游ゴシックはおすすめしない理由こんにちは、こんばんは!せきゆおう です。 游ゴシックは好きですか?僕も印刷物では使いますが、ウェブサイトでは「游ゴシックを使ってください」と指示されるまでは使いません。 また、そう指示された場合もデメリットは必ずお伝えするようにしています。 「游ゴシックってMacでもWindowsでも標準でインストールされているし、デバイスフォントとして使う際に最有力候補では?」という方も多いです。それでも僕は推奨しません。 その理由は4つあります。 ・游ゴシックはWindowsでかすれて見える ・スマホ端末に游ゴシックは搭載されていない ・実はMacOSで游ゴシックは標準では搭載されていない ・今後、システムフォントとして使えないブラウザが増える それら4つの理由を参考資料を交えつつ解説したいと思います。 その前に...游ゴシックの採用率は非常に高い
UIデザインには、至る所に中央揃えが使用されます。 しかし、アイコンとテキストが美しく揃わない、テキストがボタンの中央からずれている、そんなことはありませんか? UIデザインで中央配置がずれてしまうときの理由、実装時にデベロッパーができること、デザイナーができること、数字的そして視覚的な調整方法などを紹介します。すぐに実装で試したくなることばかりです。 Hardest Problem in Computer Science: Centering Things by Niki Tonsky 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに フォントにおける中央揃え line-heightにおける中央揃え アイコンにおける中央揃え アイコンフォントにおける中央揃え 中央配置がずれているのは、スキルの問題 水平方向の中央揃え
こんにちは!東芝UIデザインチームnote事務局の小林Jです。 みなさんは「使いやすさ」について、どのように考え、どのようにデザインしていますか?ちゃんと「使いやすい」ものづくりができているか不安になったことはありませんか? そんな時によりどころになるのが「人間工学」です。 「人間工学」とは、人間にとって使いやすく、安全な道具や製品、システムを考える学問です。人間特性をもとに環境や道具の使い勝手などを研究する学問でもあります。 「人間特性」とは、知覚から認知、身体に至るまで人間特有のあらゆる機能や性質のことです。どうしてそのような行動をするのか、という原理を知っていることが、モノづくりや仕組みづくりをする人たちにはとても大切なんです。 弊社デザイン部門には人間特性ワーキンググループという専門チームがあり、デザイン部門内で情報共有や勉強会を行っております。 noteにも「人間工学シリーズ」と
こんにちは!株式会社Rabeeの新人デザイナーのakaneです🏋 今回は、Webデザインで「紙っぽさ」を出す方法を考えてみました。参考事例も掲載しながら紹介していくので、どうぞ最後までお楽しみください! はじめに:「紙っぽさ」とは?私が言う「紙っぽさ」とは、おもに「雑誌っぽさ」のことです。Webデザインだけど、雑誌っぽい。ディスプレイに映っているけれど、エディトリアル感がある。 たとえば、以下のようなデザインは私にとって「紙っぽい」例です。 出典:六本木未来会議出典:DMN出典:ぼくのおじさんどうして、私はこれらを雑誌のようだと感じるのでしょう?自分なりに考えたポイントを、ひとつずつ紹介していきます。 その①:文字が「組まれて」いる最初に挙げたWebサイトのひとつをよく見てみると、画像左上にある「NO. 153」の文字のうち、「NO.」だけが縦向きになっています。「NO.」と「153」を
モバイルファーストのウェブデザインは、デスクトップで閲覧する際に重大なユーザビリティ上の問題を引き起こす。長いスクロールページにコンテンツが過度に分散され、余白が広がり、画像やフォントが拡大されるため、ユーザーが情報を把握し、理解することが難しくなるのである。 The Negative Impact of Mobile-First Web Design on Desktop by Kim Salazar, Tim Neusesser and Nishi Chitale on October 13, 2023 日本語版2024年2月6日公開 最近のウェブサイトの多くは、モバイルファーストなアプローチでデザインされている。こうしたページをデスクトップデバイスで表示すると、コンテンツが過度に大きく引き伸ばされて見えることがある。画面を覆い尽くすような画像、肥大化したテキスト、過剰な余白のせいで、
前回は、「UIデザインってそもそも何なの?」という概論的な説明と、UIデザイン未導入の組織の中でみんなでデザインを始めてみるための施策(プロトタイピングとユーザビリティ評価)を話しました。 今回はサービス、プロダクト開発において、デザイナーではない人でも知っていて損はないUIデザインの重要ポイントについて説明します。主に以下の3つのテーマについて順番に議論をしていきます。 デバイスやソフトによるUIの違い ユーザーにかかる身体的・認知的負荷を理解する UIの重要概念(ナビゲーション、インタラクションなど)を知る 「ちょっと」と銘打っておきながらめちゃくちゃ長いnoteになってしまったので、気になる項目だけ読むか、何回かに分けて読んでいただくことをおすすめします、。 ※どこか内容に間違ってる部分やご意見ありましたらコメントいただけたら嬉しいです。 なお、こちらの記事の内容は順次YouTube
「チームトポロジー」や「エンジニアリングマネージャーのしごと」「スクラム実践者が知るべき97のこと」の著者や翻訳者などで知られる吉羽龍太郎氏が、「ソフトウェアに関わる人が知っておくといいかもしれない法則10個(勝手セレクション)」という興味深いポストをX(旧Twitter)で公開しています。 ソフトウェアに関わる人が知っておくといいかもしれない法則10個(勝手セレクション) コンウェイの法則 パレートの法則 グッドハートの法則 パーキンソンの法則 ブルックスの法則 リトルの法則 ピーターの法則 ハインリッヒの法則 ピーク・エンドの法則 ホフスタッターの法則 — Ryutaro YOSHIBA (@ryuzee) January 23, 2024 これらの法則の多くは経験則だったりもしますが、いずれにせよ知っておくと上司の説得に役立ったり、ソフトウェアの開発現場でチームの運営に役立ったり、物
株式会社HAPPY ANALYTICSの小川卓(id:ryuka01)です。 Google Analytics 4 の本格利用がGoogle Analytics終了とともに始まり、多くのサイトや企業が移行を完了したと思われます。しかしGA4は新しい計測形式になり、混同しやすい内容が増えました。特に今までGAを使っていた人ほど、誤った理解で設定を行ったり、数値の定義を間違えて理解してしまいます。 そこで今回は誤った理解をされがちな数値を8個まとめてみました。普段なにげなく使っている指標も実はこんな仕様だった!というのを理解しておくと、適切な指標を選んだり、説明できたり出来るようになります。 みなさんが正しく仕様を理解できているかを1つずつチェックしながら、ぜひ本記事をご覧ください。 「設定」編も参考にしてみてください。 Google Analytics 4 でミスされやすい・誤解されやすい「
2019年にフリーランスとして独立した時すぐに声をかけていただいて、そこからずっとUIデザイナーとして関わってきた株式会社FLINTERSが今年で設立10周年なんだそうです。それを記念して、なんとメンバーでリレーしながら133日間ブログを書き続けるチャレンジに挑戦中とのこと。今回はその101日目の記事となります。 漫画アプリ「GANMA!」漫画アプリGANMA!僕が関わっているのはGANMA!のスマホアプリです。iOS向けとAndroid向けがあり、その両方のデザインを担当しています。 オリジナルの作品ですと、最近アニメ化された山田くんとLv999の恋をするなどが有名でしょうか。作品自体はいろんな漫画アプリで読めますが、原作はGANMA!発。最新話が最速で読めるのもGANMA!だけです。 GANMA!のデザイナーはずっと僕1人だけなので、僕の思想や判断がけっこう大きめにデザインに反映される
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 人は見た目が9割 皆さん一度はこの言葉を耳にしたことがあるのでしょう。内面がどれほど素晴らしくても、外見がそれに見合わないと、なかなか本当の価値を認めてもらえないものです。 この話は人間だけでなく、アプリケーションにも当てはまります。どれだけ内容が素晴らしくても、見た目がイマイチだったり使い勝手が悪かったりすると、ユーザーに敬遠されてしまいます。(私は以前ネ⚪︎フリからア⚪︎プラに切り替えたのですが、使いにくく感じたため、すぐに元のサービスに戻しました) エンジニアの皆さん、優れた技術力を持ちながら、デザインが原因でユーザー離
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く