放送大学マイルストーン('23)｜lumpsucker
はじめにこの記事は、放送大学の（主に情報コースを中心とする）学生さん向けに、私の履修済み科目の感想と主観的評価を共有して、履修計画の参考にしていただくことを目的に作成しました。下記の記事の通り、2019年-2020年の2年間で情報コースの科目を8割方履修したのでそれなりの網羅性があるかと思います。 （2023年2月追記）その後、選科履修生として履修した他コースの科目や大学院科目などを追加して112科目掲載しています。試験難易度については履修時期によって会場試験・在宅ペーパー試験・在宅Web試験が混在しているので参考程度でお願いします。 タイトルは私が現役生の時に通っていた大学の似たような評価システムから拝借しました。 以下の科目は基本的にナンバリングが低い順に並べています。閉講済みの科目も混じっていますが、記録と後継科目の参考のために残しておきます。あくまで全て（上記の記事にある通り、文系
1画面を平面ではなく側面で考える UI Stack｜みーた
さてさて、今回の本題。 最近プライベートで新規サービスのUI監修みたいなことをやったのですが、その際に「UI Stack」の考え方が意外と知れ渡ってないように感じたので、要点だけの内容ですが綴ってみたいと思います。 元の話は英語でこちら↓に詳しく書いてあります。 しっかり読み解いてみたい方は覗いてみてください。 1画面は平面ではなく側面があるPinterestやDribbbleなどで「パッと見の雰囲気いいなぁ」というデザインには最近よく出くわすようになってきて、それを新規の画面やサービスに取り入れようと考えることが多いかと思いますが、実装までいって使ってみたけど「なんか違和感あるな」みたいなことありませんか？ それは「1画面の側面を見れていない」からかもしれません。 側面とは一体なんなのか。 それは「状態」です。 私達の住む世界は必ずしも完璧ではなく、間違いや遅延が発生します。それはサーバ
良いUIを支えるフロントエンド開発のポイント
前回書いた「なぜUIデザインとフロントエンド開発に注力しているのか」はおかげさまで（自分の記事としては）様々な反響をいただきました。SNS上の言及だけでなくカジュアル面談でも話題にしていただく方が多くとても嬉しいです。 フロントエンド開発とUIデザインの関係についてもう少し掘り下げるため、今回は良いUIを支えるためにフロントエンド開発で重要になるポイントだと Gaji-Labo が考えていることをまとめていきます。 前提：リリースも仮説検証の通過点ウォーターフォール的な開発が主流だった一昔前は、サービスのリリースがひとつのゴールだったように感じます。しかし、Web開発にもアジャイル開発や人間中心設計の手法などが浸透した現在では、リリースしたら終わりというプロジェクトは少なくなりました。（フェーズの変化によりチームの体制が縮小されるというのは当然ありますが、リリース後もある程度の規模感で開発
なぜUIデザインとフロントエンド開発に注力しているのか
Gaji-Labo は “すべてのサービスとプロダクトに「手ざわりのいいUI」を” というタグラインを掲げ、「フロントエンド開発」「UIデザイン」「チームとプロセスの支援」の3つの柱で受託の事業をおこなっています。 現在とくに主力となっているのがフロントエンド開発とUIデザインですが、受託の開発会社・制作会社でこの2つを掲げている会社は少ない気がします。 弊社サイトのキャプチャーインターフェイスは人間に一番近いユーザーインターフェイスはサービスのなかで一番ユーザーに近い部分だと思っています。 僕は15年ちょっと前にHTMLコーダーからキャリアをスタートしました。その頃からHTMLコーディングは地味な仕事だけど「HTMLは情報を」「CSSは表現を」「JSはインタラクションを」ユーザーに直接届けるところに楽しさを見出していました。 その後マークアップエンジニア・フロントエンドエンジニアと世間で
atoms の「制御・非制御」をどう作るのか
本稿では React で atoms を作る際「制御・非制御」どちら前程に作るべきか？という課題についてを考察します。 「制御・非制御」は atoms では決定しない なぜ決定しないのかは「ライブラリ選定に縛られないため」につきます。Form 関連ライブラリはたくさん選択肢がありますが、この選定が atom に影響するのはあまり良いパターンではありません。 「制御・非制御」は atoms では決定しないといっても、正確には以下の「A・B」のうち 「A」で決定しない という意味です。以下「A・B」の様にきちんと分けて構成することで「A」は「制御・非制御」に囚われず、再利用することが出来ます。 A. 【"style"決定層】CSS のみが適用された element 集 B. 【"制御・非制御"決定層】A を用いて、再度小さい atom を構築する CSS in JS 以外での定義 CSS in
Apollo Server と Apollo Client を写経しながら GraphQL を学べる「初めての GraphQL」を読んだ - kakakakakku blog
2019年11月に発売された「初めての GraphQL」を読んだ．1度ザッと読んだ後に，気になっていた Apollo Server と Apollo Client の実装を写経しながら理解を深めていたため，書評をまとめるのに少し遅れてしまった． タイトルに「初めての」とある通り，GraphQL 初学者をターゲットに網羅的に学ぶことができる1冊だった．特に「背景 → クエリ → スキーマ → リゾルバ → クライアント → 実戦投入」という流れは素晴らしく，一言で表現すると「知りたい！を知れる本」かなと！5章と6章は時間を取って写経するのが良いと思う． 初めてのGraphQL ―Webサービスを作って学ぶ新世代API 作者:Eve Porcello,Alex BanksオライリージャパンAmazon 目次 1章 : GraphQLへようこそ 2章 : グラフ理論 3章 : GraphQLの問
ぼくの理想のボタンの padding 設定
初めての Zenn 記事です！ 先日ふと思い立ってこんなことをツイートしました。 ツイートした後、calc() 使えば？というリプライをいただいて、あ、できるかも、と思って試してみたらできた。という記事です。 CodePen のリンクを貼ります！ おわり？ お…終わっちゃった！（4行しか文章書いてない😅） これで終わっちゃうのも寂しいので一応ちょっとだけ解説してみます！ padding 部分の解説 CodePen みてもらえればと思いますが、最終的にこんな感じになっています。 .c-button { padding: max(calc(1em + (1rem - 1em)), 0.2em) max(calc(1em + (1rem - 1em) * 0.2), 0.4em); } やりたかったこととしては、こんな感じです。 基本、font-size に基づいて padding が決まる（
ミニマルなモーダルライブラリをnpmで公開しました
ミニマルなモーダルライブラリ(MinimalModal.js)を自作してみたので紹介します。 MinimalModal.js とは 🤔 TypeScript で作成された、軽量かつ最小限の機能のモーダルライブラリです。 なんでこのライブラリ作ったの？ 🤔 Micromodal.jsを使おうと思ったのですが、 背景スクロール無効がなかったり、IE 未対応といったところが私の用途には合わなかったため、 いっそのこと作ってしまったほうが早いかなと考え、作ってみました。 機能 😋 モーダル用エレメントの open 属性の有無、及び aria-hidden の true/false の切り替え (開閉のアニメーションは CSS で実装) 背景をクリックまたは ESC キー押下でモーダルを閉じる。 (HTML の実装次第で背景クリックでも閉じないようにできる) タブキーのフォーカス移動でモーダル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Amazon.co.jp: UXリサーチの道具箱II ―ユーザビリティテスト実践ガイドブック―: 樽本徹也: 本