サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
災害への備え
www.cocoblo.jp
昔はポートフォリオサイトは持っていたのですが閉鎖してしまい今は作品をお見せする機会が少なくなってしましました…… 就職や転職をされる場合はやはり持っておいていたほうが有利になります。もちろんフリーランスの方も持っていてクライアントにお見せするときなどにも重宝します。 今回は1からポートフォリオサイトを制作していく流れなどをまとめていきたいと思います。 ちなみ実際に運用したサイトはJolieeというポートフォリオサイトです。よろしくお願いします! サイトの構成をまとめる これは一番大切なことなのでノートにまとめたりEvernoteなどにわかりやすくまとめておくと良いです。運用のルールなど自分だけが管理するものなので思いついたことを残しましょう。 アイキャッチにもなっている画像が実際に今回作成したポートフォリオサイトでの走り書きのメモです。全体のレイアウト、仮想ページのレイアウト、メニューなど
今回はIllustratorで簡単な地図を描く方法を紹介していきます。今回使うツールはGoogleマップが重要になってきます。 昔は地図を描くときは結構苦労したのですが、Googleマップが登場して描きやすくなりました。 今回描く地図は東京都杉並区の高円寺駅近辺をターゲットにしていきます。それでは地図を書いて行きましょう。 Googleマップで目的地近辺を検索 馴染みある地域で申し訳ありません……飲み屋も多くとっても居心地が良い高円寺そんな素敵な街を作っていきます。 まずはGoogleマップで目的地を検索します。目的地が決まったら次に微調整していきます。駅からの距離などを目視で確認しながら調整して行きましょう。 地図をトレース まずはGoogleマップでキャプチャした画像をIllustratorに貼り付けます。お好みで透明度などを調整してください。 右側のレイヤーに注目して欲しいのです
Gitを触り始めて間もないのですが参考書もためになりますがネットにもたくさんの情報が掲載されています。 まずはGitとはどういうものかを紹介しているサイトから具体的な流れなどを紹介しているサイトをご紹介します。 ニッチなことなどは自分も勉強不足なところもあるので初心者の方にも馴染めるようなサイトを紹介したいと思います。 ひと通りの流れを勉強するのに最適 サルでもわかるGit入門 まずはここは読んでいて損はないところかと思います。ボリュームもあるので一気読みはおすすめしませんが入門編から読んでみると理解しやすいかと思います。イラストも可愛く読みやすい作りです。 GitHubに関する記事 他にも様々なブログでGitHubに関して書かれていたりしていますのでググったりしてみてはいかがでしょうか? Windowsにgitをインストールしてgithubにpushするまで Git/GitHub初心者の
お気に入りのWebサイトを紹介したいと思います。職場が変わった、パソコンが変わった時にいちいち探すのも少し面倒なのでブログに残しておきたいと思います。 とても勉強になるサイトばかりなのでチェックしてみてはいかがでしょうか? タグリファレンス HTMLクイックリファレンス 目的別にHTMLやCSSのタグを探すことができる。ど忘れした時に調度良い感じがします。 TAG index HTMLやCSSのタグについてまとめられている。HTML5のタグも追加された。 HTMLやCSSを学び始めた頃から参考にさせてもらっているサイトです。タグの具体的な内容が書かれているので手軽に調べることができます。 デザインリンク Web Design Clip 業種やカラーでWebサイトを探すことができます。 Responsive Web Design JP レスポンシブデザインのサイトデザインを紹介してい
SIMフリースマートフォンを手に入れて約1ヶ月ですが今のところ満足している@cocolejpです。 格安と言っていいのかはわかりませんが通信費がここまで安くなるとは思ってもいませんでした。携帯料金高いと思っていたのでなおさらかもしれません。 自分はまだBIC SIMしか利用したことはありませんが特典といいますかプラスされるサービスも嬉しかったりするので今回何社かまとめてみたいと思います。 月額900円〜 BIC SIM BIC SIM 3種類のプランが用意されていて最安値で900円からと安くSMS機能付きでも1040円。 通信容量も2GBからなのでそこまで頻繁に使わない方も始めやすいかと思います。 特典としてWi2 300のサービスが受けられます!マクドナルド、空港、駅、成田エクスプレス、リムジンバス車内、丸ビル、横浜エリア等の公衆無線LANスポットでWPA/WPA2対応、最大300Mbp
WindowsもMacも両方使わないとやって行けていない@cocolejpです。 さて今回は外出時によくMacBook Airを持ち歩いているんですが、たまにデザイン業務などが発生したりとなにかとマウスが欲しくなったりする時があります。 本来であればやっぱり純正のマウスがほしいところだったのですが、外出時に手軽に使え傷ついてもそんなに心が折れないようなマウスにしました。お金のなかったので… マルチタッチジェスチャーいいですよね!使いやすかったなぁ。 とは言え何個も何個も買えるシロモノではないのでちゃんと調査もしましたよ!そりゃちょっと好きなメーカ優先にはなりましたが。 結局今回買ったのはロジクールのBluetooth Mouse for Mac M558です。 開封の儀を行いながらブログを書こうとしたのですが…なんか商品も見えているし案外喜びもあんまりなかったのでやめておきました…… ぱっ
年末年始はいろいろとセールがあって、ついつい財布のひもがゆるくなってしまいますね。 アマゾンも年末年始のセールを行っています!気になるセールはKindle本 年末年始セールです! Kindleを使い始めたきっかけはセールが頻繁にあることでした。気になっていた新書や参考書が安くなっている時によく利用しています。今回はコンピュータ関連の参考書を買いあさりました… 今回は年末年始のセールなので結構大盤振る舞いしている感じがしました。全部はご紹介できないのですがジャンルごとにいくつか紹介したいと思います。
ついに@cocolejpもLINE Creators Marketに参加してしまいました。 さっそく初めてクリエイターズスタンプに登録されてみての感想や反省点などをまとめてみたいとおもいます。 今回登録されたスタンプはcocolen(ココルン)と言う当ブログのマークでもあるキャラクターをモチーフにしています。 この機会にキャラクター化という行動に出ました。当ブログの左上のマークが今回のネタです。お名前はココルンですよろしくお願いします。 では今回の制作においての話をまとめていきたいと思います。 制作から審査まで 実際に制作に取り掛かったのは2014年6月15日から色々と構想をねったりして19日に下絵が完成しIllustratorで作業を開始しました。 キャラクターのことを考えると、どんな感じの子にしようかなどと設定から入りました。そしてスタンプで表現されている言葉などを参考に、このこならこ
LINEクリエイターズスタンプ流行っていますね!クリエイターの皆さんの個性豊かなスタンプが日に日に増えています。 自分も負けじといくつかは審査に出しているのですけども…なかなか発売には至らずです…… そんなまだまだ発売もされていないクリエイターズスタンプですが、どこかでアピールできないかな?と思って検索をしてみたらStampers(スタンパーズ)と言うサービスを発見しました。 早速登録をしてみたので使い勝手をレビューしたいと思います。 発売前でも登録が可能 描いたスタンプさえあれば誰でも無料で登録ができます。参加しているクリエイターの方も日に日に増えています。 本来であれば自分のブログやサイトでPRするのがメリットでもあるのですが、サイトを作ったりすると何かと時間もかかるものです。 会員登録をしたら自分のスタンプを管理できるマイページが使えます。 ちなみにこれが自分のスタンパーズのマイペー
Copyright © 2014 cocoblo. All Rights Reserved. 当サイトで紹介している書籍などはAmazonや楽天市場のアフィリエイトを利用しています。
マルチタッチジェスチャーいいですよね!使いやすかったなぁ。 とは言え何個も何個も買えるシロモノではないのでちゃんと調査もしましたよ!そりゃちょっと好きなメーカ優先にはなりましたが。 結局今回買ったのはロジクールのBluetooth Mouse for Mac M558です。 開封の儀を行いながらブログを書こうとしたのですが…なんか商品も見えているし案外喜びもあんまりなかったのでやめておきました…… ぱっと見の感想としては小さめなマウスです。 携帯性には優れているマウスかと思います。フォルムもマジックマウスに比べるとちょっとふっくらしていますがフィットしやすい曲面です。 ぱっと見はWindowsマウスですね。右クリックもできますし。個人的に右クリックできるのはちょっと嬉しかったりもします。 上下のスクロールはやっぱりマジックマウスの操作性が良いです…Windowsマウスに慣れているならホイー
WordPressネタが久しぶりの@cocolejpです。 今日はGWの休日を利用して自分のブログのお手入れを行っています。 さて当サイトでも利用しているJetpackですがこれを使っているとなかなか連携に便利だと今更気づいたので紹介したいと思います。 では本題に移ります。皆さんはAkismetの登録はお済みですか? スパム対策サービスとして有名ですね。WordPressをインストールすると必ずプラグインに入っています。 AkismetのWebサイトも何度かリニューアル?しているみたいなでAkismet登録で検索してみると情報が古かったりするのでご注意ください。 Akismetの登録は結構とっつきにくかったり(英語だから……)とあったのですがJetpackと連携するとスムーズだったのでブログに残しておきます。 Akismetの登録方法 まずは有効化していないAkismetを有効化するところ
中野区大好きです!住み心地もいいし美味しいものたくさんあるし…失敗もありますが… サブカルチャーな街とも言われていますが新宿へも近いですし、都心へのアクセスも便利。おとなりの高円寺も捨てがたいですが…… そんな中野区をいろいろと調べることがあったのでまとめておきたいと思います。 お役所関連 まずは中野区の区役所などを紹介。お役所なので様々な部署があり色々とホームページを探すだけでも大変です… 中野区役所 中野区立図書館 Facebook 中野区役所 Twitter 東京都中野区(広報担当) 中野区に住んだりするなら必ずチェックしておきたいホームページです。SNSも積極的に取り入れているので比較的最新の情報が入りやすいです。 スポーツ 公共施設の強みは手軽に利用ができることと料金が安い!最近では若い方の利用者も増えています。フィットネスクラブの休館日に利用される方も増えています! 中野体育館
iPhoneの登場から?FacebookとかのSNSが登場してから写真というのが人気になりましたね。 なんでも撮ってしまう@cocolejpですが皆様はカメラを活用していますか?? 自分のiPhoneにはカメラアプリがいくつか入っています。もちろんデフォルトのカメラも使います。 メインで使っているのが細かい設定が特徴のProCameraで、SNSに投稿したりするときはInstagramやInstaWeatherとかを使っています。 今回はよくレストランや喫茶店などで使わせてもらっているOneCamのご紹介。 無音だけが特徴じゃない 無音のカメラアプリとして人気のOneCamなんです。無音は確かに助かります大助かりです。 ただアップデートとかして更に便利になったんです!! 機能面を考えればProCameraのほうが細かい設定はできるのですが、ずぼらな性格の自分には人がいる中でもサッと撮ること
最近になってやっと電子書籍というのに手を出した@cocolejpです。 とは言っても必ず電子書籍じゃないと嫌というわけでもないのですが。気に入った本は書店やアマゾンで購入するまだまだ電子書籍に馴染めていない新参者です。 とは言えアマゾンを眺めているとKindleが目につくのでついつい眺めに行ってしまいます。そんな時に「これは!」と思ったのがKindle日替わりセールだったんです。 この時から毎日のように眺めるようになりました。 電子書籍デビューの感想 ほんと数多くの電子書籍が売られているんですね。Kindleだけを眺めているのですが多いですね。と言うことで電子書籍を購入する際はKindleを利用することに決定!! KindleはiPadにもアプリがあるので早速インストールしてみました。
皆さんはもうやりましたか?Twitterの新しいカバー画像とアイコン画像の変更。 @cocolejpも変更を行い新たにカバーとマークを新調しました。 ますます画像は大きくなりFacebookのような仕様になりつつありますね。 大きな変更があったのでぜひ皆様も変更の準備を行ってみてはいかがでしょうか? アイコン画像は400pxに変更 以前のアイコンよりも大きくなり400×400 ピクセルになりました。 小さいサイズのアイコンのままだと画像は荒くなってしまいますのでカンパスサイズを変更するなりしなければなりませんね…… カバー画像は横1500px、高さ500pxに変更 横広なカバー画像が必要になってきます。1500×500 ピクセルに変更されました。 前回のカバーとも仕様がかなり変わってくるので作り変えたほうが無難かもしれませんね。 色々と変更しないといけないところがありますがTwitterを
すっかりWEB制作フローのメモを止めてしまいましたが、レスポンシブWEBデザインでフィットネスクラブのサイトを作ってみるの続きのコンテンツです。では早速、今回制作していく所をまず紹介していきます。 完成サイトのサンプルは「Sample Fitness Club」になります。ただし完成途中だったり、実際のデザインと異なる場合がありますので予めご了承ください… 初めての方へのページデザイン では早速下層ページ(セカンドページ)の制作に取り掛かっていきましょう。下層のページはそこまで難しく考えないでも良いかと思います。トップページである程度理解できるようでしたらすんなり入っていけると思います。 ただしモバイルファーストと言うことを頭に叩きこんでおいてください。レスポンシブデザインでサイト制作する時はスマホからですよ!!…話がそれました。 まずは初めての方へのページをデザインしていきます。Phot
新年あけましておめでとうございます。今年もよろしくお願いします。 年末年始にかけて仕事が忙しくなり思い通りにブログが書けていません……まだまだやり残している事がたくさんあるのに。せっかく来て頂いているのに何も進展がないブログも面白く無いので今年は今以上に更新できるようにしていきたいと思います。情報がまだ少ないブログですがよろしくお願いします。 では2014年最初のブログ投稿は年末に書いた2013年総まとめ!買って良かった参考書の紹介に登場してきたWebディレクション標準スキル152が非常にWebデザイナーとして読んでみると参考になったのでもう少し詳しくご紹介したいと思います。 制作者にとっては当然の流れかも知れないが Web業界にいて必ずと言っていいほどディレクション業務は重要視されています。デザイナーの方が比較的次のステップに登るためのステップでもあったりします。 具体的にWebディレク
すっかり書評てきなこともやり始めてしまったSichoruですが最近はWordPressのネタばかりを探している毎日です。 WordPressを使い始めてまだまだ浅いですが、Webデザイナーがコーディングを覚え小さなポータルサイトを構築できるまで成長させてくれたオープンソースです。毎日が新しい発見、失敗の連続です。 最近虜になった参考書を紹介します。現場でかならず使われているWordPressデザインのメソッドこれが今の自分にとっては最適な参考書です。 WordPressに慣れてきた方向けかも ちょっとWordPressに慣れた方向けの参考書と思ったのがファーストインプレッションです。参考書の最初の方はどの参考書にも書かれている内容が書かれています。ローカル環境でのWordPressの動かし方など。 理解しているところは斜め読み程度に流しても良いかと思います。では中身についてまとめていきたい
パッケージもかわいい モバイルバッテリーのパッケージは思った以上に小さいです。今回のモバイル自体が結構小さいので、可愛いサイズのダンボールにバッテリーが収まっています。なんかパッケージもとっておきたくなる感じです。 親切な説明 リボルテック ダンボー・ミニも一緒に購入してしまいました…!!かわいすぎます。 さて、パッケージには様々な説明や仕様などが書かれているのですがどこを見てもわかりやすいです。 スマホ、タブレット、WiFiルーターなんでも充電ができます!臨機応変に対応できます!! 細かい仕様が書かれています!!でも読みやすい。 付属品もかわいい ダンボールの中身はこんなかんじです。モバイルバッテリー本体、ポーチ、ケーブル。 かわいい! とにかく届いた商品がかわいすぎです。バッテリーを入れるポーチも。手触りもいいしここにもダンボーのマークが!! 小さくなってもパワフルなモバイルバッテリー
現在WordPressで実案件を想定としたWordPress構築術を紹介しています。レスポンシブWEBデザインで作っているのですがあまり詳しく解説していなかったので今回改めてまとめていきたいと思います。 今回目標としているサイトは小規模のフィットネスクラブです。サンプルサイトをご用意していますのでスマホやPCで確認してみてください。 今回のサンプル: Sample Fitness Club まずはサイトのデザインを考える 最初はどのようにサイトを組み立ててて行くか考えていきます。 完成形のデザインと変わっている場合もありますが、まずはいつも通りにPhotoshopなどでデザインをしていきます。画像にはありませんがスマートフォン用のデザインやタブレット用のデザインも用意しましょう。 極端にサイトの表示、デザインが変わってしまうような場合はレスポンシブWEBデザインにする意味が無いので注意しな
ココブロはWebデザインやiPhone、ガジェットなど様々な情報を配信しているブログです。もちろん初心者の方でも安心して閲覧できるよう日々自分も勉強しながら更新しています。Copyright © 2014 cocoblo. All Rights Reserved. 当サイトで紹介している書籍などはAmazonや楽天市場のアフィリエイトを利用しています。
このページを最初にブックマークしてみませんか?
『cocoblo [ココブロ]』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く