The Front End Developer/Engineer Handbook 2024
This guide is open source, please go ⭐️ it on GitHub and make suggestions/edits there! https://github.com/FrontendMasters/front-end-handbook-2024 1. Overview of Field of Work This section provides an overview of the field of front-end development/engineering. 1.1 — What is a (Frontend||UI||UX) Developer/Engineer? A front-end developer/engineer uses Web Platform Technologies —namely HTML, CSS, and
これがユーザーの信頼を失うデザインだ！ 最近のUIで見かけるダークパターンのしっかりとした知識が身につくデザイン書 -ザ・ダークパターン
ダークパターンとは、WebサイトやスマホアプリのUIをユーザーに惑わせるデザインにし、ユーザーの個人情報や時間やお金をかすめ取る手法です。 たとえば、知らない間にメール配信が登録されていたり、料金に手数料が加えられていたり、登録は簡単なのに退会が難しかったり、キャンセルがクリックしにくいようにデザインされてたり、さまざまなダークパターンが存在します。 最近のダークパターンをはじめ、さまざまなダークパターンを反面教師として学び、制作側として気をつけたいポイントが解説されたデザイン書を紹介します。 ユーザーとして騙されないように知識を増やしておくのにも有用です。 著者は「UXライティングの教科書（紹介記事）」や「ザ・マイクロコピー（紹介記事」などでお馴染みの仲野 佑希氏。これまではライティング主体の解説書を紹介してきましたが、本書はダークパターンの解説書です。デザインによるダークパターンだけで
正真正銘のReactだけの不純物なしでReact入門
Reactのチュートリアル、たくさんありますよね。どれも質が高く、どこから手をつければいいかわからなくなっちゃいます。 ですがやはり巷のチュートリアルには面倒な問題もあります。今回は面倒ごとを全部すっ飛ばしてReactでのウェブアプリ作りに入門してみましょう。 Reactを始めるには、まずあれとこれとそれとどれと…… Reactやるには、まずNode.js入れてbabel入れてreact入れてreact-router入れて、ついでにredux入れてreact-redux入れて、redux-saga入れて…… Reactめんどくせえ！！！ってのが正直なところだと思います。はい、私もそう思います。ただ、まあ、色々必要なのも事実なので……。 それでもやっぱり「ReactやるならReactだけやりたい。他はどうでもいい」という気持ちは簡単に捨てられるものではありません。そこで今回はそういう面倒全部
SPAと覚悟
Frontend Meetup vol.1 - SPAを語り尽くす会! でのLT資料です。 http://connpass.com/event/38112/
その文字、薄すぎない？ デザインにおける灰色の明度は何%が最適か
UX Movementにおいて記者、編集長を務めます。明快で効果的なデザインに美点を見出し、利用者のために払う労力を惜しみません。 一言で灰色と言っても、明るいものもあれば暗いものもあり、実に様々なバリエーションがあります。Webサイトなどでは、いたるところでお目にかかることのできる色でもあります。濃い灰色は主に見出しや本文に、薄い灰色はメタデータ、分類名、説明文に多く使われます。これらの色合いのうち、最も乱用されるのは薄い灰色です。 薄い灰色の文字の問題点 文字色として薄すぎる灰色は可読性に問題を起こしかねません。灰色の文字を薄くしすぎてしまえば、読者が読むにあたって支障をきたすことになります。文字の明度によっては、薄い色の背景に混ざってしまうのです。この現象は、単語や文字をぼやけさせ、判読を困難にします。無理に判読を試みれば、目を傷めてしまうでしょう。 また、薄い灰色の文字は読者の誘導
フラットデザインへの長期接触： このトレンドが、どうユーザーの効率を下げているか
クリックできるUI要素のシグニファイアがなかったり弱かったりすると、ユーザーは次第にページ中をあやふやなままクリックしたり、マウスオーバーするようになる。そうすると、効率が落ちる一方、コンテキストからの手がかりやクリックへの即時フィードバックがより期待されるようになる。 Long-Term Exposure to Flat Design: How the Trend Slowly Decreases User Efficiency by Kate Meyer on November 8, 2015 日本語版2015年12月21日公開 完全にフラットなビジュアルデザインのインタフェースではリアリズムや立体効果をまったく利用しない。それは結果的に、クリックできることをユーザーに伝えるために従来から利用されてきた強制的な視覚的手がかりに引導を渡すものであった。 極端にフラットなインタフェースの人
Web Components と Electron でつくる Neovim フロントエンドの未来 - はやくプログラムになりたい
この記事は Vim Advent Calendar 2015 の20日目の記事です． まずはこちらのスクリーンショットをご覧ください． エディタの UI やカーソル移動は Vim っぽいですが，markdown ライブプレビューやカーソル位置での画像ポップアップ，組み込みブラウザなど謎の UI が見て取れます．本記事ではこれについてボトムアップで必要な知識から順を追って紹介します． 長い……三行で Neovim msgpack-rpc API を使って <canvas> と Node.js API で Neovim フロントエンドを作成し Web Component としてラップ して HTML アプリに簡単に組み込めるようにした上で UI プラグインをウェブ技術で構築できる NyaoVim という Neovim GUI エディタを Electron 使ってつくってます． 目次 Web C
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
