» 制作ブログ|ホームページ制作・運営からWEBデザイン、ウェブサイト企画作成を行っている名古屋市のホームページ制作会社「ABABAI」

制作ブログ

制作ブログ

  • お疲れ様です。

     

    いつもいつもテンパっていると言わている、
    鈴木です。

     

    今回はタイトル通りになりますが、

     

     

    ・急がないといけない!
    ・緊急事態発生!!ヤバイ!!!
    ・どうしよう~~!!! ヤバイヤバイ!!

     

     

    などなど・・・
    仕事中は色んな事が起きますよね。

     

    ただ、こういう急がないといけない時ほど、
    落ち着いて冷静に考えて行動する事が必要だと思うんです。

     

     

    ——————————-

    急ぐ = 早く行動する
    ではなく、

    急ぐ = 一つ一つの作業を確実に完了させる
    という意識をどんな状況でも持ち続ける事だと思います。

    ——————————-

     

     

     

    ついつい問題やトラブルが発生すると、
    「早く対応しなきゃ!!」と頭でいっぱいになりがちで、

    結局、問題だと言われたことだけを考えてやっていると
    問題の本質に気付けなく、ただただ時間が過ぎていくということも少なくないと思います。

     

    そこで、どんな事にも対応できる  の状態を
    どうやって作ったらいいのか。維持したらいいのか。

     

    僕がやっている心を落ち着かせる方法をご紹介します。
    ※個人差の価値観によって違いますので、ご了承を・・・

     

     

     

    STEP 01 コーヒーを飲む
    20170113_01
    問題が発生したら、まずコーヒーを飲みます。
    コーヒーを飲んで、とにかく心を落ち着かせます。

     

     

    STEP 02 状況把握
    20170113_02
    作業はせず状況を理解するための正しい情報を集めます。
    この段階ではまだ作業には入らない事が多いです。
    いくつか仮説を立てます。

     

     

    STEP 03 トライ&エラー

    「おそらく○○が起きているだろう」と仮説をひとつたてて、
    とりあえず、問題の本質なのかを確認します。
    違っていたら、ほかの仮説を考えるか、試します。
    なかなか解決できない時は、画面から目を離して考えることに集中します。

     

     

    STEP 04 専門知識がある人に相談します■被写体の人物はストックフォトモデルです。撮影許諾を得ています。
    相談するにも、いくつか仮説をトライ&エラーしてもうまくいかなかった状況を
    説明する必要します。あらかじめ自分の仮説を試しておくことで、
    専門知識がある人の時間や労力を余計に使ってしまうことなく相談ができます。

     

    → 基本はここの段階で解決する事がほとんどです。
    ※いつも相談に乗って下さっている皆様、ありがとうございますm(_ _)m

     

     

     

    でも・・・

     

     

     

    STEP 05 もしかしたら、解決出来ない状況かもしれない
    20170113_05
    いろいろ試して、相談して、それでもだめなら、
    問題の本質は、自分ではどうしようもない所で起きている場合があります。
    そうなってしまったら、時間をいつまでも使うのではなく、
    正しい状況と情報を、原因も分かるのなら、困っている人に伝えます。

     

     

    このように緊急事態だとしても、
    確実なステップを踏めば誰でも問題の本質に到達できるのです!!

     

     

     

     

    だから、まず落ち着いてコーヒーを飲みましょう!!

    Senior Man Drinking Coffee Lifestyle Concept

    ※あくまで個人の価値観です。批判とかはしないでね!

     

     

     

  • こんにちは、渡邉です。

     

     

     

     

     

     

     

     

     

     

     

     

     

     

    ヒクヒクします。

     

     

     

    誰もが一度は経験したことがあると思います…。

    あれです。

    ものすごく不快なやつ。

     

     

     

    片目だけ、目の下がヒクヒクします。

     

    000

     

     

    かれこれ1週間くらい…

     

     

     

    ヒクヒクします。

     

     

     

    誰か止めて…。

    睡眠もたっぷりとって、休み中はパソコンも見ませんでした。

     

     

    でも…

     

     

    ヒクヒクするんです。

     

     

     

    気になってgoogleさんで調べてみました。

     

    「目がヒクヒク」

     

    やっぱりみんなこの不快感経験したことがあるんでしょうね、

    色々ヒットしました。

    その中で気になるいくつか。

     

     

    ・眼瞼ミオキミア

    ・眼瞼ジストニア

    ・顔面スパスム

     

     

    1つ目、「眼瞼ミリオネア」ではありません、「ミオキミア」です。

    3つ目、「顔面スパム」ではありません、「スパスム」です。

     

     

     

     

     

    「眼瞼ミオキミア」

    疲労やストレス、睡眠不足などが原因で起こる目のまわりの筋肉のけいれんだそうです。

    やはり、パソコン、スマホなどのデジタル機器による目の疲労が大きく、

    また、心理的ストレスも関与しているとのことです。

    コーヒーを飲んでも症状が強く出る場合があるそうです。

    やべ…今まさに書きながら飲んでるわ…

    通常は数日~数週間で自然におさまります、とのこと。

     

     

    「眼瞼けいれん(眼瞼ジストニア)」

    目のまわりの筋肉がけいれんして、目があけにくくなる病気。

    重症になると目があけられなくなってしまうそうです。

    治療にはボツリヌス毒素の注射が一般的。

     

     

    「顔面スパスム」

    始めは目のまわりがヒクヒクし、それから口元へと広がるようです。

    動脈硬化などで血管が顔面神経を圧迫して起こるそうです。

    重症の場合は脳外科での手術をする場合もあります。

     

     

     

     

     

    2つ目3つ目は、本当につらい病気のようです…。

    眼科を受診してきちんと治療を受ける必要があるとのこと。

     

     

     

    おそらく、私のヒクヒクは「眼瞼ミオキミア」かと思われます。

    1日7時間、勤務中はずーっとパソコンと向き合ってます。

    帰ってからもスマホは必須。

    野菜や果物を買うのもスマホです。

    何やかんや調べものもスマホ。

    SNSもスマホでチェック。

     

     

     

    これは確かに目を酷使しています。

    今まで裸眼1.5というのは奇跡に思われます。

    やっぱり眼瞼ミリオネアでしょう。

    目を少し休めるようにしないとダメですね…。

     

     

     

     

    いや、しかし待って。

     

    本当に眼瞼ミオキミアでしょうか。

     

    眼瞼ミリオネアだとしても…

     

    「目を少し休めれば治る」

     

    なんて楽観的に考えてもいいのでしょうか。

     

    もっと現実を直視しなければならないのではないか。

     

     

     

     

    スットクデールも言ってました。

    ベトナム戦争下で捕虜になり、何度も拷問を受けつつも

    必ず生還できると信じ、生き抜いて家族のもとに帰れたという人です。

     

     

     

    自分がおかれている厳しい現実を受け入れて、勝利の結末を確信して動くこと。

    根拠のない楽観主義ではものごとに変化はなく絶望する。(渡邉解釈)

     

     

     

    よし!私はこのヒクヒクとおさらばするために今日から動きます!

    ヒクヒクへの勝利を信じて!!

     

     

     

     

    まず、仕事以外のスマホを断つ!

     

    家に帰ってからも仕事が気になりメールを見る事がある

    一切メールは見ない!次の朝驚くことになろうとも!

     

    気になる事があるとついついスマホで調べたくなる

    自分の直感のみ信じる!状弱でいいじゃないか!

     

    便利なので買い物はネット任せ

    野菜は八百屋!肉は肉屋!

     

    かわいい娘息子の写真を撮りたい

    今の一瞬を目に焼き付けろ!

     

    かわいい娘息子をSNSでみんなに自慢したい

    自慢するまでもない!客観的にかわいい!!

     

     

     

     

     

    さてさて、決意を表明したところで

    PC画面にかじり付いて仕事します♪

    では。

  • あけましておめでとうございます。

    2017年も株式会社アババイをどうぞよろしくお願いいたします。

     

    こんにちは。制作のカトリーナです。

    SNSでの自分の写真映りの悪さでお悩みの方、多いのではないでしょうか・・・

    今朝のアババイ不満の朝礼でも同じ話題が出ていました。

     

    URL:http://ameblo.jp/ababai-reveille/

     

    そんな時は、Photoshop初心者の方でも簡単に出来る、

    Photoshopの顔立ち調整ツールでプチ整形してみましょう。

     

    顔立ち調整ツールとは、顔の大きさ、目の大きさ、鼻の高さなど、とっても簡単に、

    スライドで調整できる機能です。

     

    今回は、アババイデザイナーの鈴木さんのお顔をお借りしました。(悪意はありません(>_<))

    こんな感じで、お顔が正面を向いていて、髪の毛などで隠れていない方が

    調整しやすいです。

     

    【BEFORE】

    blog1

     

    Photoshopの、フィルターからゆがみを選択。

    こんな感じで部分的にスライドで調整します。

    blog2

     

    【AFTER】

    blog3

     

    なんだかシュッとした印象になりました!

    (元から素敵ですが(>_<))

    SNSのフォロワー数やいいね!の数もなんだか増えそうです。

     

    以上、顔立ち調整ツールの紹介でした。

    Photoshopは、本気を出せばもっとイケメンになれちゃう機能がたくさんあります。

    また、後々紹介していきたいと思います。

     

  • こんばんは。
    制作の近藤です。

    使い勝手のいい写真や画像の素材屋さんはネットにたくさんあったりしますが、
    いいという理由で有料素材はじゃんじゃか使えません。
    でもデザインの決め手の一つとなるくらい素材は重要です。

    今回はそんな立場の強い味方である、私が定期的にお世話になってる便利な無料素材サイトを無分類で紹介します。

     

     

    Free vector

    free-vector-for-free-download-about-215299-free-vector-sort-by-newest-first

    海外の素材サイトです。
    英語検索が必要ですがほぼ全てがベクターデータで落とせます。

    無害ですがたまに変なデータもDLされることもあります。

    他にも写真アイコンフォントなど他の素材も充実してます。(こちらはあまり使ってない)

     

     

     

     

    Subtle Patterns

    subtle-patterns-free-textures-for-your-next-web-project

    背景パターンの素材サイト
    イラスト系から、壁素材、紙素材、など幅広い背景素材がDLできます。
    レビュー機能もあるので流し見してるだけでも楽しかったりします。

     

     

     

     

    フキダシデザイン

    %e5%90%b9%e3%81%8d%e5%87%ba%e3%81%97%e7%b4%a0%e6%9d%90%e5%b0%82%e9%96%80%e3%82%b5%e3%82%a4%e3%83%88%e3%80%8c%e3%83%95%e3%82%ad%e3%82%bf%e3%82%99%e3%82%b7%e3%83%86%e3%82%99%e3%82%b5%e3%82%99%e3%82%a4

    吹き出しの素材が多様なタッチや形でDLできます。
    JPEG、PNGはもちろん、aiデータも扱ってる便利サイト。

    こちらの系列である、
    フレームデザインシルエット素材ピクトグラム矢印の素材サイトも
    強い味方です。

     

     

     

     

    イラストAC

    %e7%84%a1%e6%96%99%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88%e3%81%aa%e3%82%89%e3%80%8c%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88ac%e3%80%8d

    無料会員制素材サイト
    イラスト素材がjpegからベクターまで、揃ってて非常に便利でした・・・・が。。。

    最近は有料会員寄りのサービスになってきて、DLが1日回数制だったり、
    観覧すら回数制限されるようになってしまったのがキズです。

    他にも写真素材シルエットなどなど、他素材のカテゴリーでも充実しています。

     

     

     

    以上近藤の強い味方でした。

    他にもここもいいぞというのがあれば教えていただきたいです。

    ではお疲れさまです。

  •  

    51

     

    おはようございます!

    デザイナーの稲本です^^

     

    日々のデザイン業務に携わっていると 色々な写真の切り抜き素材に触れることが多くなります、 そんな中でも結構面倒な切り抜き素材と出会うこともまれではありません。

     

     

     

     

     

    ・・・例えばこんな写真

    01

     

    あらら、見て下さいとてもモジャッとしてます。

    どこかで見たことある顔です。

     

    今日はこんなモジャと遭遇した際の

    早く・簡単に切り抜ける方法と、ちょっとした便利な機能をご紹介^^

     

     

     

     

    まずは、頭以外の所をいつも通りズバズバ切り抜きしてこの状態に、

    02

     

     

    切り抜いたレイヤーを複製し

    複製したレイヤーの頭以外のところはいらないので消しちゃいます

    準備できた頭レイヤーを全選択状態に、

    03

     

     

    選択ツールで、

    レイヤーの選択エリア内でメニューを開き、境界線を調整

    04

     

     

    エッジの検出の半径を250pxにして、OKボタン

    ※エッジの調整でパラメーターを振って微調整も可能

    05

     

     

    検出されたエリアのみが選択されるようになるので、

    Ctrl+Shift+Iで選択エリアを反転して消したい部分を選択して

    06

     

     

    モジャ以外の部分を削除すると・・・

    07

     

     

    あとは、最初に複製して残しておいた全体のレイヤーを上に持ってきて

    頭の部分をマスクで隠すなりして後ろの頭だけのレイヤーと結合

    08

     

     

    イイ感じでモジャが切り抜かれているのではないでしょうか。

     

     

    そして最後の仕上げ。

    黒い背景を作って切り抜いたモジャを見てみると

    まだうっすらと白くぼやけた境界の汚れが残っているので、

    境界線の汚れを除去するマッティングという機能を使って消します。

     

    09

     

    すると・・・↓↓↓

     

    10

     

     

    白モジャがかなり軽減されました!

     

     

    切り抜きの際に残ってしまう境界線の汚れはよくあることですが、

    それらの問題のほとんどは、このマッティング機能や

    他の機能と併用することでかなり解決することが出来ます。

    今回は白マットを使いましたが、黒マットやフリンジ削除も便利ですので

    機会があれば色々と試してみるといいかもしれません^^

    上手く使うことで、上の画像の境界部分をさらにキレイにすることも可能です。

     

     

    知っている方は当然な機能ですが、

    使った事ない方は結構使えるので是非お試しあれ♪

     

     

     

     

    ではでは良いクリスマスを\(^o^)/

    11

     

  • こんばんは!制作のEHARAです。 

     

    99パーセントの方には全く役に立たない・・でも、、

     

    photoshopユーザーなら一度は感じたことがある!かもしれない・・

     

    データもきれいにつくりたいデザイナーのために・・・

     

    レイヤーを複製した時に表示されるうざったい

    「コピー」「コピー2」「コピー3」を表示させない方法。 

    %e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-1

     

     

     

     

    レイヤーパネルの赤枠部分から、パネルオプションを選択。

    %e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-2

     

    コピーしたレイヤーとグループに「コピー」を追加、のチェックを外す!

    たったこれだけ!

    %e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-3

     

    何枚複製しても、、レイヤーがすっきり!きれい!

    (しかし、成果物には関係ありません・・)

    %e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-4

  • おはようございます。

    制作のチャッキーです。

    さて、ブログを書くのはかなり久しぶりな気がします・・・。
    さかのぼって確認してみると前回書いたのが今年の2月という・・・。
    ブログの更新に関しては空気のように生きてきましたので結構間が空いてしまいました。

    今後はアババイ制作チームのフィクサーとでもいいましょうか・・・。
    一番権力があり、なおかつ怖いという理由で制作ブログの記事の管理を任された人が
    内容等々に目を光らせてくれるようですので、いやな汗をかきつつ

    楽しくサクサク更新していこうと思います♪

    20161215 

    それにしてもこの写真、目が全然笑ってませんね
    この目で睨まれるとABABAIのデザイナー達は蛇に睨まれたカエル状態です・・・。

    カエルと言えば最近なぜか楽天のディスプレイ広告が僕にカエルのお肉をごり押ししてきて正直動揺しています。
    そもそも、こいつは何を思って僕にカエルの肉を勧めてくるのでしょう・・・。

    謎です・・・。

    仕事に煮詰まってきたことですし、、、
    よそごとしてみよう♪とバナー(カエルの肉)の原因を探ることにしました。

    カエルの肉の謎を追っていきついたのがどうやらクッキーと呼ばれるものが裏で糸を引いてるらしいということ。

    2016121502
    量多いし高いのか安いのか相場がよくわからない商品ですね・・・。
    一つ上のウサギの肉もどうかとは思いますが・・・。

    そもそもクッキーって?ということでこの機会にCookie(クッキー)について
    軽く調べてみました。

    困った時のウィキペディア先生に聞いてみたところ
    —————————————-
    HTTP cookie(エイチティーティーピークッキー、単にクッキーとも表記される)は、
    RFC 6265などで定義されたHTTPにおけるウェブサーバとウェブブラウザ間で状態を
    管理するプロトコル、またそこで用いられるウェブブラウザに保存された情報のことを指す。
    ユーザ識別やセッション管理を実現する目的などに利用される。

    by Wikipedia
    —————————————-
    とのことです。
    はい、意味がわかりませんね。なにをいってるんでしょう・・・。

    日本語に翻訳するとCookie(クッキー)
    ホームページを見た時にパソコンに保存される情報のこと

    「この人●月●日●時ににこのページ見てたよ」
    みたいなのがパソコンに保存されるわけです。

    ざっくりな説明ですがこれ以上深追いしてもいいことなさそうなので
    今回はこれくらいにします。

    ディスプレイ広告はそのCookie(クッキー)と呼ばれる情報を元に
    その人に最適な情報を吐きだしてるようです。

    なんだかとても効率的ですね。

    クッキーはホームページを見た時にパソコンに保存される情報のこと
    ディスプレイ広告はクッキーを利用して最適な広告をユーザーに提供という仕組みのようです。

    ABABAIではディスプレイ広告等の対応も大丈夫です。
    気になった方はご相談ください・・・。

    ・・・。
    結局、なぜカエルの肉が出てきたのかは謎なままです。
    カエルの肉が僕にとって最適な広告ってどういう事だよ・・・。
    時間ある時にクッキーの中を漁ってみようかなということで・・・。

    ではでは。

  • こんにちは!制作部のニコラスです!

     

     

    samune

     

     

    仕事上建築物の写真にふれる機会が多いので、写真にふれる際に私が気をつけていることをご紹介したいと思います!

     

     

     

     

    ■ニコラスの経験

     

    私事ですが、過去にプロカメラマンが撮った建築竣工写真をひたすら垂直水平をまっすぐにしたり、カメラレンズのゴミをひたすら取るというアルバイトを1年くらいしていたことがあります。

     

    その時に教わった建築写真を美しくみせるポイントの1つとして 垂直水平をキチンと整えてあげることでした。

     

    ※ちなみにニコラスはカメラの知識は素人です。

     

     

     

     

     

    ■使用ソフト

     

    Adobe社のPhotoshopというソフトを使用しております!月々980円からのプランもあったりします。お試しもできるので興味のある方はさわってみてください| ω ・ )b

     

     

     

     

     

     

    ■実際にやってみる

     

    photo001s
    ↑ではこちらの写真をまっすぐにしてみたいとおもいます!

     

     

     

     

     

     

    000

    ↑photoshopで写真(jpg)を開き、「フィルタ」→「レンズ補正」を選びます。

     

     

     

     

     

     

    001
    ↑別画面に切り替わります。赤枠のところのつまみをいじって調整していきます。

     

     

     

     

     

     

     

    002
    ↑最低限さわっているところはこちらになります。
    ①まずここで全体の傾きを左右均等にします

    ②そしてこちらで縦のラインをまっすぐにします

    ③水平も調整するのであればここでまっすぐにします
     ※斜めからとってるときなど写真の取り方によって水平はいじらない場合あります

    ④レンズによる膨張などのゆがみはこちらで調整できます

     

     

     

     

     

     

     

     

     

     

    photo_01_tts
    ↑最後にトリミングをしてできあがったのがこちらです

    印象がピシッとしましたね| ω ・ )しましたよね?

     

     

     

     

     

     

    ■最後に

     

    どうでしょうか、信頼感など印象や伝えられるものが少し変化したかと思います。個人的には垂直水平を整えたほうが単純にキレイにみえるので好きなのですが、サイトの目的によってはあえて素人感や親近感や敷居的なものを伝えるためにあえて崩した写真をつかったほうがいい場合もありますので、あくまでも1つのテクニックとしてご紹介できたらと思います| ω ・ )ノシ

  • こんにちは!
    アババイのディレクター原田です。
    今週はディレクターweekですね。
    先日はバービー

    WEBディレクターってなんなのさ?駄菓子で仕事してみました

    とお仕事を紹介してくれました。

     

    ディレクターっていろんなことしてますね。
    この指示書の他にも、
    ・案件を動かす
    ・撮影
    ・インタビュー
    ・打ち合わせ
    ・企画、構成
    ・web内の文章を起こす

    などなどいろいろやってますが、ディレクターだって人間。
    たまには息抜きします。

     

    息抜きってとても大事!

     

    息抜きしないとガッチガチな狭い世界の人間になってしまいます。
    それに人間の集中力って医学的には平均で50分と言われているそうです。

    ーーーーーーーーーーーーーーーーーー

    集中力.net(http://comesmile.net/time/
    引用

    今回は、その50分を有効的に活用するためのオススメサイトをご紹介しようと思います!

    ーーーーーーーーーーーーーーーーーー

     

    ①何かと 「あーでもない、こーでもない」と考えて結果が

    まとまらないことが多い方!

     

    とりあえず、google mapさんにお任せ!!!!

    「どこでもドア〜〜〜〜」

    20161210site-01

    http://ww3.safestyle-windows.co.uk/the-secret-door/

    どこに飛ばされましたか?
    きっと素敵なところに連れていってくれたに違いありません。
    その悩んでいることは、他人に聞いてみたりすると、案外すんなり解決するかもしれませんよ。

     

     

    ②とりあえず、いろんな景色を眺めたいなー。

     

    自然を最近みてないかも。そんなあなた。

    「マンタで飛んじゃうよ!」

    20161210site-02

    http://grapee.jp/259829

    ちょっと感動しませんか?
    まるで二匹のマンタが空を飛んでるみたい。

    こんな風に砂丘や森の上を飛ぶのは気持ちのいいものですね。

     

     

    ③バリバリ働いちゃうんだから!でも1日PCの前にかじりついちゃうの><

     

    というアナタ。

    「オススメは暖炉」

    20161210site-03

    https://www.calm.com/

    これでも観て、細かい文字から解放されましょう。

     

    ーーーーーーーーーーーーーーーーーーー

    ということで、良い週末を〜〜〜

  • こんにちは!
    ディレクターの坂本です。

     

    今日は、これからホームページ制作をお願いしようか考えていらっしゃる方へWEBディレクターってなんなのさ?をご説明しようと思います。

     

    あくまで私のやり方なので、あしからず。。

     

     

     

    WEBディレクターは色んなお仕事をします。
    最初の企画・構成から、営業さんと一緒に練った戦略のもと「ワイヤーフレーム」というものを制作します。

     

     

    そして、ワイヤーにイメージを伝えるために「モックアップ」を制作します。

     

     

    ワイヤーはこんな感じです。

     

     

     

    sakamotoarch

     

    ザックリですが、こんな感じで作っていきます。

     

     

    実際にお客様がイメージしやすいように、更にデザインをするのがデザイナーさんのお仕事になります。

     

     

    色んなサイトが世の中たくさん溢れてますが、効果と集客を求めるべく練ります。

    めっちゃ練って練って練って完成させていきます。

     

     

     

    そして、その戦略をご報告してOKをいただけましたら本制作スタートとなるのですが、
    そこから先はお問い合わせ下さい♪笑

     

     

    さて!

     

    突然ですがアババイには駄菓子が溢れております。

     

    こちらです。

     

     

     

    img_1414

     

    先ほど出てきた「ワイヤーフレーム」を駄菓子で作ってみようかしら?と思いまして、

     

    作ってみました。

     

    遊び心です。

     

     

    こちらです。

     

     

    001

     

     

    どうです?このコンテンツ量!(?)

     

    通常あり得そうなワイヤーです。

    ユーザビリティを意識した2カラムですね。

     

     

    お次はこちら。

     

    002

     

    レスポンシブデザインと言いましょうか、jsで動きの指示をしたくなる様相ですね。
    1カラムは勇気のいるデザインです。

     

     

    お次は

     

     

    003

     

    美しいですグリッドデザイン!

    1つ1つのバナーにインパクトとメリハリが無いと弱いですが、大きさにメリハリを付ければ良さそうですね。

     

     

     

     

     

    はい、次。

     

    004

     

     

     

    枠を跳び越えろ!そんな少し変わったパターンです。

     

     

    あまり直線でコンテンツを仕切らず、スクロールの中で引っかかりを持たせるタイプです。
    ユーザビリティを高めるために「ページTOPへ戻る」の追跡バナーは緑色の熊さんです(そろそろ訳わからないですかね)

     

     

    0041

     

     

     

    こちらはSEOテキストエリア。
    キーワードが粒揃いとはこの事ですかね!(?)

     

     

     

     

    あれ?ヒヨコが来ました。

     

     

     

    005

     

    006

     

    あれ

     

    007 

     

     

    008 

     

     

     

    …。

     

     

     

    009

     

    010

     

     

     

    ………。

     

     

     

    011

     

     

    ………。

     

     

     

    真面目に働けということでしょうかね。

     

     

    012

     

     

     

    ちなみにコチラは仮画像でございます。

     

    使えません(食べれません)ので注意が必要です。

     

     

     

    という事で第一回目から訳わからないかと思いますが、
    日々遊びを入れながら構成や企画、ユーザビリティ、そして集客効果求めて頑張っております。

     

     

     

     

    お仕事はキチンとやっておりますので
    ご安心くださいね♪

     

     

     

    終わり

  • 貴方は、人に「ドーン」したくなる時は、ありませんか・・・

    今回は、パターンのスライスが苦手なコーダーさんが、デザイナーさんに「ど~ん!する前に」知っておきたい、オンラインツールの紹介ですm(__)m

    まずは、パターンのデザインを見た時のコーダーの心境を見てみましょう。

    nakahara_20161130

    割とこんな気持ちで、スライスしてるコーダーさんも、多いんではないでしょうか。

     

    自分も、このツールと出会うまで、斜めのスライスは苦手でした・・・
    ど~ん!は今だ未遂です。

    今回は、斜めパターンのスライスを劇的「楽」にする!
    オンラインツールの紹介です(-ω-)/

    その名は・・・

    stripegenerator(パターンジェネレーター)

    http://www.stripegenerator.com/

    なんと!!今回は、 自ら、実践形式で説明致します!!

    ▽ 本題ここから ▽ 

    覚えるのは実践あるのみ!
      実際に、stripegeneratorでパターンを作成してみた!!

     

     

    今回、実践で作ってみるのは、自社ページ:ホームページ制作の流れのここの背景パターン

    nakahara_20161130_02

     

    パターンを作成したい箇所を、Photoshopなど拡大して、パターン作成に必要なデータを収集します。

     

    nakahara_20161130_03

     

    ※ ブログでは見やすいように、画像拡大していますが、実際は虫眼鏡ツールで拡大して、実寸の狂わないように拡大をお願いします。

     

     

    【stripegenerator(パターンジェネレーター)】
    http://www.stripegenerator.com/

    に移動して

     

    nakahara_20161130_04

     

    先程、収集したデータを入力します!!

     

    stripe size (斜め線の幅)  サンプルでは 4px

     

    stripe color(s) (斜め線と、斜め線の間の幅) サンプルでは 4px

     

    spacing (斜め線の色)  サンプルでは 2268a3(入力時 # は除く)

     

    background color(s)(斜め線と、斜め線の間の色) サンプルでは 2571ab(入力時 # は除く)

     

    stripe orientation(線の、縦、横、斜めの位置設定)

     

    nakahara_20161130_05

     

    入力しましたら、downloadボタンを押し、パターン作成終了です!

     

    思いのほか、小さくパターンを作成してくれるので(容量の節約にもok)、今までPhotoshopなどスライスしていた方も

    是非、この機会にお使いください(/・ω・)/< 容量が小さいことはイイことだ!

     

    ■ サンプルで作成した、パターン画像
    http://ababai.co.jp/wp-content/themes/ababai_commonTmp/css/../images/flow/ptn_01.png

     

    ▲ 本題ここまで ▲

     

    また、水玉等の場合や、これ!?どこでスライス場合が、本当に増えてきたら・・・
    デザイナー様に、スライスお願いするか・・・m(__)m

     

    本当に

     

    nakahara_20161130_06

     

    しちゃいましょうw

     

    中原はしませんが(笑)
    以上、テンテンこと中原でした|д゚)< マタ・・・イツカ

  • こんにちは!
    鈴木です!

     

    今日は、制作ブログの担当になりました!
    よろしくお願いします!

     

    さて今日は、丁度自分に該当したことでしたので、
    ついでにブログに書いときます(^ ^)

     

    色んな理由から名古屋と広島を行き来する事がありますので、
    メールソフトのThunderbird(サンダーバード)の移設をマスターしようと思います。

     

    ローカル環境にのサンダーバードをインストールしている場合でも、
    同期が本当に楽だとは知りませんでした!

     

    ステップは、以外の3ステップくらい!

     

    移設前pc
    20161128_01
    01   %APPDATA%\Thunderbird\Profiles  にアクセス
    上記アドレスをフォルダのURLエリアへコピーしてください!

     

     

    移設前pc
    20161128_02

    02 出現したファイルをまるっとコピー
    こんな名前のフォルダをコピーして、HDDなどに保存します。

     

     

    移設後pc
    20161128_03

    03 同じフォルダにアクセス。
    サンダーバードを通常通りインストールをして
    コピー貼り付けで、保存、ファイル名をコピー先のものに名前を書き換えます。

     

     

    以上で再現完了!
    これで、出張先にpcさえあればOKですね(^ ^)
    ※移設先に、サンダーバードをまずインストールする必要だけあります!

    皆さんにも、メールソフトサンダーバード、オススメします!!

  • こんにちは、渡邉です。

     

    ご存知の方がいらっしゃるかもしれないですが、

    弊社サイトがリニューアルしました。

     

     

    それにともない、

    かつてアメブロで書いていた記事をこちらで書く事になりました。

     

     

    せっかくリニューアルしたので、ガシガシ更新していきたいと思います。

    いや、更新できるといいな…。

    更新しなければならない…。

    お願い、更新して…。

     

     

    というわけで、

    せっかくなので、初心を取り戻すため、

    ブログの書き方について色々調べてみました。

     

     

    せっかく書いても読んでもらえなければ、モチベーションもあがらないですからね…。

    もし、少しでもこの記事がお役にたったら是非ぜひ、一番下のfacebookの「いいね」押してください♪

     

     

    さてさて、ブログの書き方の3要素

     

    【1】気を引くタイトル

    【2】読みやすさ

    【3】読者目線

     

    とりあえず今回は、一つ目の「タイトル」を攻略していきたいと思います。

     

     

     

    【1】気を引く記事タイトル


     

    まずは実践してみましょう。

    今日、小松菜の煮浸しを作ったとします。

    その記事をブログに書くとしましょう。

     

     

    01

     

    タイトル:「小松菜の煮浸し」

     

     

     

     

    …そのままです。

    何の興味もそそらせません。

     

     

     

    タイトル:「レンジで簡単!小松菜の煮浸し」

     

     

     

    ほほう…。

    時間のない共働きの主婦向けですね。

     

     

     

    タイトル:「レンジ3分!まぜるだけ!あと1品欲しいときの小松菜の煮浸し」

     

     

     

    だいぶ切羽詰まった主婦向け。

    具体的な数字を出していくのもいいですね。

     

     

     

    タイトル:「レンジでも栄養そのまま!今が旬、小松菜の煮浸し」

     

     

     

    ちょっと栄養や季節を気にする余裕のある主婦向け。

     

    あ、そういえば…

    忘れておりました、このブログ、WEB制作ブログでした…。

    ターゲットを変えてみましょう。

     

     

     

     

     

    タイトル:「デザインのアイデアひらめき☆冴え渡る、小松菜の煮浸し」

     

    タイトル:「電磁波に負けない!老化防止ビタミンA!小松菜の煮浸し」

     

    タイトル:「迫る納期、老け込む前にビタミンE!小松菜の煮浸し」

     

    タイトル:「無茶なデザインにもイライラしない!コーダーのための、カルシウムたっぷり♪小松菜の煮浸し」

     

    タイトル:「キャパオーバー!助けてお母さん、平和だったあの頃の…小松菜の煮浸し」

     

     

     

     

     

    …。

    すみません、もはや何のブログか分かりません。

    ちなみに、私、小松菜よりほうれん草の方が好きなので、今夜のメニューはほうれん草にします♪

     

     

    ではでは、また。

  • 制作部による制作人による
    制作ブログを新たに始めました!

     

    これまで以上に見やすく、役に立つ情報と役に立たない情報を
    発信していきます!

     

    過去のブログに関してはコチラ>>

     
    ababaicreater_h2

     

    これからも宜しくお願いいたします!

     

    スタッフ一同

名古屋で1番真面目なウェブ会社!! ABABAI お電話でのお問い合わせはこちら

メールでのお問い合わせ リンクボタン

最新記事

2017年1月
« 12月    
 1
2345678
9101112131415
16171819202122
23242526272829
3031  

アーカイブ

MENU

求人情報本社・広島オフィス

お問い合わせ

ページの先頭へ

お問い合わせ

閉じる

アババイめちゃ凄いこと

建築会社に選ばれる5.5の理由

制作実績

お客様の声

スタッフ紹介

代表挨拶

新着情報

会社概要&アクセス