フロントエンジニアの立ち位置とか、立ち振る舞いとか?

こんばんは。
だらだらとご飯つくって、アニメ見ていたらこんな時間。

今日は、仕事してて思ったフロントとしての他のポジションの人たちとの関わりとかとか。

仕事の流れとしては、 * 仕様書の確認(仕様が口頭のときはなし) * デザインがあればそれと照らし合わせて
* 作ります!

まあ、当たり前の流れで。

ただね、やっぱりその間に色んな事考える訳です。
例えば、動的なサイトな訳で、開発側にデータを組み込んでもらわなきゃいけない。
もちろん、HTMLを使いやすくくむってのは考えてる。
単純にマークアップ側でも、メンテナンスしやすいようにとも考えるけど。。
動的にデータが入ってるとこはこーやったらいいかなーみたいな。
あくまで、みたいな。の状態なんだけど。

後は、途中で仕様が変更になった時のもろもろ。
開発側に一旦マークアップのファイル渡した後だったりすると、
変に組み替えたりできないし、cssの調整くらいで終わらせたかったり。
この辺りが慣れてないから、手こずった。

あとは、ディレクターさん、デザイナーさんとかそもそも技術的な用語が分からない人に
説明する時の説明方法がなっかなか難しい。
普段から、技術者ばっかと話してるからカタカナを多用する癖が。
相手がどのくらい分かってるのか、どのくらい理解してもらわないと話が進まないか見極めて、
説明している。

ディレクターさんと、ここどうしようか?
みたいな時もある。最適解を見つけたいけど、、、まだまだ知識が少なくてうまくいかず。
自分で決断して、判断する事も必要だと思うしね。

開発側にはファイルの受け渡しが今回結構ミスってしまった。。。
何がどう必要なのか、確認すべきだったなあ。
画像とかSplite画像だから名前とか変なやつだし。
そのあたり、sass分かってくれる人ならもう少しらくだったかなと笑

デザイナーさんとは、まあとにかくきたデザインそのままマークアップに起こすしかないね。
実機で確認して、ちょっとfont小さい?余白狭くない?みたいな相談したり。
一応自分でもデザイン勉強してるから知識的にはここは困る事はなかったかと。

あと、1ヶ月弱のリリースに向けて頑張ります!

最近の勉強法 フロントエンジニアっぽいこととかね。

こんばんは。
こんな幼い文章でも、読んでくれている人がいるみたいで。
何か、お役に立てればとおもって、今日も書いてみる。

そんなエンジニア1年目さんのあれこれ。

最近の勉強法?としては。
まずはやっぱりRSSよんでるかなあ。
それよりも最近はざっくばらんにQiitaの記事読んでみたり、
はてぶのやつジャンル問わず読んでみたり。

Feedly使ってはいるけど、
前ほど読まなきゃ!みたいな感じではない。

メインで勉強してるのは、やぱりJavaScriptだな。
ライブラリもたくさんあるし、フロントとして外せないよね。
世の中的にも。
Reactが気になってるけど、ちょっと大規模なので有効ってのをみてそこまで、追えていないw
どっちかというと、ちょっと古いかもだけどAngularとかの方が、直近使うかなみたいな。何てったって、初心者なので。

そもそもJavaScriptとはなんぞや。
って部分から勉強してるよ。
そんな時に役に立つのは、

JavaScript 第6版

JavaScript 第6版

この子です。

言わずと知れた、この本。
正直さ、ネット上に基本中の基本はたくさん載ってるけど。
それより基本が知りたいというか。
その背景も知りたいというか。
ちょっと分厚めという人もいるけど、詳しくて、頼れる。
後は、ちょっと古いのかな。

他に利用してるのが、こんなのとかgitで他人のソースを読んでみたりとか、書き写してみたりとか。

ライブラリ系のはちょっと癖があったりして、正直まだ読み込めないし、理解不能フラグも。。。

結局、何か作ってみたりしないと知識バッか増えるようで、
結局たまってないからねw

という事で、最近はwordpressを使ってサイトの構築はじめました!(中華そばはじめましたみたいw)

まだ、ローカルにしか作成してないかつ、練習用の超シンプルなやつなので、、、お恥ずかしながら見せられませんが。

乞うご期待。

一年前にもWordPressは頑張ってて、その時は全く作れなかったのに、ローカルに環境が作れて、カスタマイズできるようになぜかなっていてw成長を実感。

最後に、でも結局一番やってるのは新しいアプリ(海外の)を入れてみて、動きとか諸々みて。楽しいし、活かせる。アプリも絶対作れるようになりたいし。

では。

wordpressのサイト作成をしてみたよよ

こんばんは。
ちょっと、ずっと1人でサイト構築をしたくて。
この業界にいるとやっぱりWP触れないって致命傷な気がしてね。

 

やってみましたよ。
思ったよりも時間はかかってしまったけど。

 

一旦ローカルに構築という事で、私はMacなので必要な物としては

* MAMP
* SublimeText
* wpをダウンロード、解凍したもの

 

これのみ!
結構色々調べたけど、構築自体はおそらくそんなに難しくないような。
MAMPはインストール→Apachの場所を解凍したwpの存在する場所にするくらい。

こちらのサイトさんを参考にさせていただきました

MAMPを使ってローカル環境にWordPressをインストールする方法

 

Sublimeの使い方はまあ、単なるテキストエディタなのでおいといて、
こちらのサイトにも記載されてるDBの作成はしないといけない。

wp-config.phpの修正は必要だよ。
ただ、テキストエディタからじゃなくて、そのままインストールしていけば手順の中にでてきてくれるみたい。

phpMyAdminとか使えなくたって平気!

 

案外初心者でも、インストールまでならいけちゃうよ。
あたりまえか笑

 

次はカスタムする時の事に関して書きます。

FBのLikeBoxを新しいのにしてみる。

書こうと思ってずいぶん、日がたってしまった。。。 既に5月笑

developers.facebook.com

他のサイトで、詳しい事はかなり書かれているので。特に再度書く事もないかとおもうのだけど。

ちょっと困った事とか、あれあれ、ってとこだけ。実際解決していないのもあるから、解決したら修正します。(多分)

  • 友達の顔写真が乗るところ、今までは複数行でてたのに1行になっちゃった?
  • という事は、高さを指定しても結局はかわらない?

コードの生成と埋め込み自体は全然難しくなくて。ただ、この2点はなやんだ。

結局1行になってるみたいだね。今のところ。

同じPJの人でまだ分かる人がいなくていなくて。

参考:SAKULIFEさん お世話になりました。

ちなみに、6月23日に使えなくなるとか書かれてはいるので!

viewsonicのディスプレイを購入してみた。

こんにちは。 最近HipHopの歌詞の深さに感動して、はまってます。

今使ってるのが、MBAの11インチという小さい画面の結構低スペックの子で。 そろそろ4年くらい使ってるので新しいのに、、、、

とおもったんですが、ちょっとまだ手が出ず。。

ディスプレイを購入してみました。 購入したのがこちら!

viewsonic

本当は27インチくらいでも良いかな、とかEIZOが良いかなとか色々悩んだのですが。

  • IPSである事
  • ノングレア(光沢がない)であること
  • 欲しいEIZOの画素数と一緒だった事
  • EIZOより1万以上もお安かった事
  • フリッカーフリーである事

まあ購入に至った動機はこの辺りです。

実際スピーカーもそれほど音が言い訳じゃないけどついてるし。

やっぱりデザイナーにとってはこのくらいのディスプレイが欲しい。

viewsonicって、日本ではあんまりみないけど、 アメリカの評価はよいようで。

LGは壊れやすいし、色んなサイトでWEBデザインやるなら!見たいな評価を調べて。

AOCとかBenQだっけな?そんなのもあったけど、ネットでの販売ばかりで見れなかったので。

何かもっと良いのがあれば、しりたいな。

scrollTopを使用するにあたってUXを考えてみたの

今日も相変わらずJS様と、戦う日々で。

何が書きたいかというと、今日はUX(そんな大げさな事じゃないかも)を
考える事があって。
スマホサイトでね。

ディレクターs「ここのページトップへのボタンタップしたら、ふんわりTOPまでもどってほしいんだけど、、、できる?」

まあ、要望としてきたのはこれくらい。
確かに、ビュン!ってトップまでいっちゃうのもなんかなとは、おもってて。

そこで、まずscrollTopのanimationで秒数指定してみたの。
まあ、一応ゆっくりにはなる。

でも、ここで考えたんだけどそもそもページトップに戻るボタンの意味を。
最初は単なるちょっとおしゃれにーみたいなかんじで考えて、
一応それでも、OKは出たんだけどなんか、雰囲気みたいなのが嫌で。

調べましたよ。
キーワードは スマホ 速度 スクロール UX こんなかんじで組み合わせて。
海外のサイトが多くて、cllickよりスクロールをさせる方が良いとか、やっぱりスクロールは滑らかにとか。
でも、ピントくる物がいまいち見当たらず。

私的には、戻る時にも多少は中のコンテンツ見てもらった方が良いのかな?
とかおもってみたけど。

大きな収穫はなかったけど、渡された課題を噛み砕いてより良い物にするってことは
重要だよなっと。

このサイトがよさげ。
[UI](uxmovement.com
)

結局、作るサービスにはゴールがあってどれだけそれを良い物にできるかだよね。

それにしてもJSはまだまだ難しい。

sanitize.css ってのがあるらしいよ

sanitize.css

最近使ってる、nomalize.cssの次みたいだね。

最初はriset.cssしか知らなくて、それで良いとおもってたけど、 nomalizeを知って、うわー便利ってなりました。

モダンブラウザとか、スマホに対応しているらしい。 リセットじゃあ、全部スタイルなくなっちゃうから色々と不便で。 nomalizeよりもユーザビリティとか意識して作られてて、 いいね。

何か分かんなかった時は

Git こちらを参考にするのが一番かと!

まずは使ってみよう。