マガジンのカバー画像

フロントエンド研究

117
フロントエンドに関して情報を発信していきます
運営しているクリエイター

2020年7月の記事一覧

iOSアプリデザインをする際に気をつけた方がいいこと

iOSアプリデザインをする際に気をつけた方がいいこと

こんちゃ!
さて、今回は
ヒューマンインターフェースガイドラインなどの基礎知識を学習したのでご紹介していきたいと思います。

はじめにiOSのヒューマンインターフェースを理解するためにはappleが発表しているガイドラインを読む必要があります。
ここにはデザインの原則と理由、どのように活用していくのかがまとまっています。
しかし、全て英文で記載されているので私の方で簡単に解説していきたいと思います

もっとみる
知っておきたいiOSのアプリ用語をまとめてみた

知っておきたいiOSのアプリ用語をまとめてみた

今回は最低限知っておきたいiOSのアプリ用語についてまとめていきます。

アクティビティインジケータ
インジケータとはコンテンンツの読み込みやデータ処理にかかっている時間を視覚化して表してくれる部品のこと。
有益な情報があればテキストも表示される。

ナビゲーションバー画面上部にあるバーのこと。
新しい画面に遷移した時は「戻るボタン」が左上に表示される。右上には「編集ボタン」や「完了ボタン」が表示

もっとみる
ヒューマンインターフェースって何だろう

ヒューマンインターフェースって何だろう

最近、IT業界への転職に合わせてWEB・アプリ周りのデザインに関する用語について勉強しています。

やはり横文字の単語が多く、純日本人の私からするとなんとなく感覚で使ってしまう言葉も多いです。

(「デザイン=見た目」とか。本来は「デザイン=設計」が正しい意識ですよね。)

この記事では、いざ説明しろと言われると言葉に詰まってしまいそうな「ヒューマンインターフェース」という言葉について、掘り下げて

もっとみる
3D回転するアニメーションについて勉強をした。

3D回転するアニメーションについて勉強をした。

本日は現在お仕事をいただいている「動画広告」で使用しているAfter Effect(以下AE)で使われる3Dアニメーションついて勉強しました!
勉強する項目としましては3Dスイッチ、カメラ、エクスプレッションの3つです!

はじめに僕自身AEを使ってまだ半年ぐらいですが、
今までは「立体的に動かして!」という要望に対して
平面のものを無理やり立体的に動かしていて、その結果大量のキーフレームを打たな

もっとみる
Webデザイン良質見本帳を読んでまとめてみた

Webデザイン良質見本帳を読んでまとめてみた

今回は久保田涼子著の「Webデザイン良質見本帳」を読んでみました。
この本を読んで初めて知ったことや覚えておきたいことをまとめました。

はじめにまずはこの本がどのような本なのかの説明をします。
こちらの本は2017年6月19日に初版が発売された本です。
この本はタイトルの通りWebデザインで役立つ知恵をまとめてくれている本です。
HTMLとCSSの説明や配色方法、各テーマに合わせたデザインの仕方

もっとみる
webディレクターのポートフォリオの作り方

webディレクターのポートフォリオの作り方

今回はWebディレクターのポートフォリオの作り方について学習をしました。
学生時代からポートフォリオを作ったことはあるのですが、
ディレクターをやっている私のポートフォリオはデザイナー色の強いポートフォリオでした。
今後の案件獲得のために更新するぞ!ってなったんですがなかなかディレクターとして売るには不十分な内容が多く、調整している中で
「ディレクターのポートフォリオってどんなのがあるんだろうか?

もっとみる
アプリアイコンを制作する際に気をつけること

アプリアイコンを制作する際に気をつけること

今回はアプリアイコンを制作する際に気をつけておくことや知っておくべきことをまとめました。
Human Interface Guidelinesに書かれていたことや調べたことを書いていきます。

Human Interface Guidelines
・シンプルにする
・単一の焦点を提供する
・機能をすぐに認識できるようにする
・背景がシンプルで透明にしない
・不可欠なものかロゴ以外で文字を使用しない

もっとみる
IA/UXプラクティスを読んで

IA/UXプラクティスを読んで

本日はIA/UXプラクティスで学習したことをまとめていきたいと思います!

はじめにそもそもUI/UXという言葉は多く聞くと思いますが、IAという言葉はあまり聞き馴染みがない方も多いのではないでしょうか?(私は初耳でした…)

IAとは・・・情報アーキテクチャとも呼ばれ、「情報をわかりやすく伝え」「受け手が情報を探しやすくする」ための表現技術です。

今回はCapture3の「モバイルにおける情報

もっとみる
ほんとに、フォント。を読んでまとめてみた

ほんとに、フォント。を読んでまとめてみた

今回はingectar-e著の「ほんとに、フォント。」を読んでみました。
「けっきょく、よはく。」の方ですね。
この本を読んで初めて知ったことや感想をまとめました。

はじめにまずはこの本がどのような本なのかの説明をします。
こちらの本は2018年3月8日に初版が発売された本です。
この本はフォントに関する基礎的なことやテーマに合わせたフォント選びをまとめてくれている本です。
フォントの名称、アレ

もっとみる
【Semantic-UI】Webアプリで使えるフレームワーク

【Semantic-UI】Webアプリで使えるフレームワーク

今回はレイアウトを調整をする際に便利なフレームワークを調査しました!
現在社内企画でビンゴをすることになり、なにかCSSで便利なフレームワークがないかなぁ…と調査を進めていました。

はじめに今回開発を進めているビンゴアプリはこちら

ユーザー名入力画面

ユーザー名を入力するとカードのタイトルに即時反映されます。

全体のビジュアル(まだレイアウト調整やデザインは未反映です)

やりたいことビン

もっとみる
アプリを作るときに気をつけておいた方がいいこと

アプリを作るときに気をつけておいた方がいいこと

最近よくアプリのモックやワイヤーフレームを作るのですが、
社内チェックを出すと文字サイズはー、色はー、マージンはー、
という言葉をよく聞きました。
これは、きっと何かルール的なものがあるぞ!と閃いてしまった
みちこはios.androidのDesignガイドラインについて勉強して見ました!

iosとandroidの印象の違い・ios

iOS7より従来の質感のあるものから全体的に平面的なものにな

もっとみる
かっこいいエンジニアとは真逆の環境からの脱出(女性エンジニア編)

かっこいいエンジニアとは真逆の環境からの脱出(女性エンジニア編)

こんにちは。

今回はIT業界に10年住み続ける女性エンジニアのお話です。

彼女がエンジニアになったきっかけ小さい頃からスポーツざんまいだった彼女は大学まで部活に励み、卒業後は何でもいいから「正社員になろう」と考えていました。
接点のないこの業界になぜ入ろうと思ったのか理由を聞きました。

「冴えるようなかっこいい理由でもあれば良かったんだけどね」と彼女は笑いながら言っていました。

最初に覚え

もっとみる
作業報告をしないために画面遷移からアプリを作るようにした話

作業報告をしないために画面遷移からアプリを作るようにした話

はじめにここ最近ずっとRuby on Railsでサーバー側の開発をしていて
今の現場で久しぶりにAndroidの開発をする事になりました。
画面の作成するのが久しぶりになっていてどう開発を進めていけばいい?
と自社の人に聞いて見た所、全部の画面を先に作るのがいいよ!
とアドバイスをもらい実践しています。
やって見た所、かなりやりやすい仕事の進め方だったので何がよかったのかをまとめようと思います!

もっとみる
Flutterのツライとこ紹介

Flutterのツライとこ紹介

こんな投稿があったので書いてみる

Lost connection to deviceが頻発でツライ複数人で開発し始めて4ヶ月程経過した頃に HotReload をすると Lost connection to deviceとコンソールに頻繁に出るメンバーが出てきた。
flutter doctor で見てみても問題はなさそう。
メモリ周りかなとは思ってるんだけど、こういった時ってどうデバッグしたらい

もっとみる