UXにおけるビジュアルデザインの5つの原則
スケール、視覚的な階層、バランス、コントラスト、ゲシュタルトの原則を正しく適用すれば、美しいデザインを生み出せるだけでなく、ユーザビリティも向上させられる。 5 Principles of Visual Design in UX by Kelley Gordon on March 1, 2020 日本語版2020年12月17日公開 ビジュアルを見たとき、我々はそれが魅力的か不愉快かを、通常、すぐに判断できる（なぜならば、こうした判断は、Don Normanのエモーショナルデザインのモデルでいうところの、本能レベルで展開されることが多いからだ）。しかしながら、レイアウトが視覚的に魅力的である理由を言語化できる人はほとんどいない。だが、優れたビジュアルデザインの原則をグラフィックに活かすことで、エンゲージメントを促進し、ユーザビリティを向上させることは可能である。 ビジュアルデザインの原則は、
Next.js + Prisma + NextAuth.js + React Query で作るフルスタックアプリケーションの新時代
どうも、@yuyaaar です。 最近は Next.js アプリを見ることが多くなってきました。もはや JAM スタックの王道、と言っても過言ではないかもしれません。 ですが、やっぱりフルスタックとなると、データベースや認証などが必要になってきて、その辺のやり方がいまいちよくわからない、という人も多いのではないでしょうか。 自分もその一人でした。😅 いろいろ調べたり作ったりした結果、今現在もっとも最強コンビであろう、 Next.jsPrismaNextAuth.jsReact Queryでのフルスタックアプリケーションの作り方をこの記事では書いていきます。 今回は、チュートリアルアプリでよくある Todo アプリを作って、vercel にデプロイ、というのをやってみたいと思います。 まずは最初に Next.js ボイラープレートアプリを作りましょう。 作成できたら、まずは TypeScr
Reactチュートリアル2：レビューサイトを作ろう
本資料について 本資料は日本大学文理学部情報科学科の開講科目「Web プログラミング」の教材として作成されました。本資料は下記のライセンスの範囲内で、当授業以外でも自由にご利用いただけます。 対象読者 本資料は、以下の教材を学習済み、もしくはそれと同等以上の知識を持っていることを前提としています。 React チュートリアル：犬画像ギャラリーを作ろう 基本情報技術者試験レベルの関係データベースの知識 本資料で学ぶこと 本資料では以下の内容を学びます。 Express と Sequelize による API サーバー開発 React と API サーバーの連携 Cross-Origin Resourcer Sharing React によるルーティング Auth0 によるユーザー認証 Heroku による API サーバーの公開 ライセンス この作品はクリエイティブ・コモンズ 表示 4.0
「フリーランス・副業向けサービス カオスマップ2020年完全版」が公開
昨年、作成・公開した＜フリーランス向けサービス カオスマップ2019年完全版＞に対して、フリーランスや複業ワーカー、関連企業から非常に多くの反響があったという。2020年も新たなサービスが続々と誕生し、最新情報をシェアすることで、役に立ちたいと思い、2020年完全版を作成したとのことだ。 １）「仕事獲得」でさらなる職種特化・地方特化型サービスの台頭 新型コロナウイルスにより、リモートワークが拡大する中で、「多拠点生活」「ワーケーション」「関係人口」などのキーワードがよく見られた。近年注目されている「地方創生」との相性もよく、都市部と地方を行き来するような生活や働き方が増え、それらを軸にした地方案件に特化したプラットフォームが誕生した。また働き方の自由度が上がった一方、自己判断で決めていく場面が増えてきており、専門家のアドバイスやモチベーション維持を目的とした「コーチング」の仕事獲得サービス
個人アプリ作家の夢のデスク構成 (2020年末)
会社を辞めて8年前にフリーランスとして自宅で働くようになってから、自分のデスクで毎日何時間も過ごすようになりました。 より高い生産性を得るために、これまで色々な作業環境の改善を積み重ねて来ました。 ただ生産性を上げるだけでなく、健康について気遣うことも大切です。 この動画では、より良い生産性と健康を実現するデスク環境作りの過程のスナップショットをみなさんに共有したいと思います。 こんにちは、個人アプリ作家のTAKUYAと申します。InkdropというMarkdownノートアプリを独りで作っています。 Software as a Serviceビジネスを成功させるにあたって、僕は独りでいろんな作業をこなしています。 プログラミングだけでなく、マーケティングのためのブログを書いたり、イラストを描いたり、ユーザサポートを提供したりなどなど。 そのため、集中の邪魔にならず、作業に没頭できる空間や道
最新の手法でブラウザのタブに表示される「Favicon(ファビコン)」を作成するとこうなる
ブラウザのタブやブックマークに表示される「Favicon(ファビコン)」は、ウェブサイトを印象づける重要な要素です。そんなファビコンを作成しウェブサイトに表示させる最新の方法について、フロントエンドエンジニアのAndrey Sitnik氏が解説しています。 How to Favicon in 2021: Six files that fit most needs — Martian Chronicles, Evil Martians’ team blog https://evilmartians.com/chronicles/how-to-favicon-in-2021-six-files-that-fit-most-needs ファビコンは2000年代初頭に生まれたコンセプトで、インターネットに公開するウェブサイトはファビコンを備えているべきだとSitnik氏は主張。しかし、ウェブサイト
フロントエンドを100倍速くした（ ＾ω＾） - Qiita
おはようございます、なのくろです。年の瀬ですね。 この記事は ABEJA Advent Calendar 2020 の最終日です。 追記：おかげさまで Qiita LGTM賞 を受賞いたしました、ありがとうございます！ 私は2020年01月にABEJAへ入社しました。チームではフロントエンド開発全般を任されています。 参入してちょうど１年が経過しましたので、今年取り組んだことをまとめました。 「フロントエンドを100倍速く」というタイトルは誇張気味なのですが、難しいことはせず、基本的なパフォーマンス改善を素直に実践したという話を書きます。 本稿では事例とやったことを紹介するのみですが、何かしらの知見や改善のきっかけに役立てば幸いです。 サービスについて 話をする前に、どんなサービスを開発しているかについて少しだけ触れます。 ABEJA社では「Insight for Retail」という、小
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
shiodaifuku.io