BLOG﻿メニューとウィジェットFacebookTwitter検索:ABOUT当サイトは株式会社アートグラフィック新潟WEB制作ブログです。WEB制作にまつわることや新潟の情報など投稿していきます。会社のホームページはこちら♪ご注意:記事は当時の情報を元に書かれておりますので、仕様が変更され記事と合わない事がございますので、その際はご容赦願います。2014年11月Facebookページにフォームを設置する。この記事は1年以上前に投稿されました。公開時の情報を元に記述してありますので、最新版に対しては内容が陳腐化している可能性があります。Facebookページに何らかのフォームを付けたいという要望は多いと思います。先日お客様から、アンケートフォームの設置依頼が来たので、設置方法をまとめておきました。やり方としてはHiveloSocialAppsの「Form」アプリを設置する形になります。項目等もある程度自由に設定できるので、中々便利です。手順1.HiveloSocialAppsをFacebookへ導入。前提条件として、どこかのFacebookページの管理人になっておいて下さい。Facebookログイン状態で、こちらのURLにアクセスします。https://apps.facebook.com/hivelosocialapps/Formを選択肢、インストールを押します。これで該当ページに設置されました。次にフォームの中身を設定します。追加済みアプリケーションに【Form】がありますので、【設定を編集】を押すとタブに表示する名前を変更できます。空欄だとデフォルトの【Form】です。任意の名前を付けて保存して下さい。次に【アプリケーションに移動】から、フォームの各項目を設定する画面に入ります。最初にフォームの見出しや、受け取り先のメールアドレスなど基本事項を設定します。次に【質問内容の設定】で、お問い合わせフォームの内容を決めていきます。参考に以下の内容で設定してみます。電話番号以外は必須にしておきます。・お名前テキストチェック・メールアドレステキストチェック・電話番号テキスト・メッセージテキストエリアチェック回答タイプは「テキスト」「テキストエリア」「チェックボックス」「セレクトボックス」「ラジオボタン」が選べますので、簡単なフォームであれば十分対応出来ると思います。必須項目も選択可能です。追加が終わると、こんな感じになります。この場面では、順番の入れ替えも可能です。実際にFacebookページを見てみると、タブの後ろの方に追加されています。目立たせたいときは、【タブの管理】から、順番を前の方に変えましょう。以上で設置は完了です。5.投稿データを見る。フォームページの下に、【管理画面】へのリンクボタンがありますので、そこからアプリの設定画面に入ります。【お問い合わせ内容を閲覧する】ボタンが出来てますので、ここから確認します。送って頂いた内容は、メールで届くのと同時にこちらの管理画面内にも蓄積されます。複数人で運用するなどFacebook上で管理を完結させたい場合は便利です。フォームが設置できると、Facebookページの使い道が広がりますね。お問い合わせ以外にも、アンケートフォームや、申込みフォームなどにも応用できます。上手に使って、訪問者からのフィードバックを集めてみましょう。FacebookFacebookページにフォームを設置する。Niteに参加してきました。「WebデザインといえばまずはPhotoshop!」って入口からきて、今までPhotoshopメインでデザインしてきました。もとはIllustratorを使う方が多かった自分(パスいじっているのが好き...)。できたら、IllustratorでもWebデザインするのに、もっと活用できたらいいなってことで、今回初めて参加してみました。気になったこと・使っていきたい機能などを、忘れない内にメモします。新潟でデザイン業務に関わる方に向けたセミナーを主催されています。株式会社スイッチの鷹野雅弘さんが主催するセミナー。CSSに限らずweb制作に関する知識を発信するセミナーです。今回は鷹野さんが講師もされていました。Web制作の動向いままでビットマップベースで行っていたパーツの作成をSVGやWebフォント、アイコンフォントなどのベクター表現や、CSS3を活用することでマルチデバイスに対応したWebデザインをしていく。時間をかけずに、編集しやすいデータをつくれるIllustratorの機能をいくつか紹介されてましたので、その中でも特に気になったものをいくつかピックアップしました。ライブカラーで再配色ハーモニーカラーをリンク。あとはホイールをぐるぐるまわすだけで簡単にカラーバリエーションができます。別々に配色する必要のあった「塗り」と「線」も、これで一度に変更が可能に!配色に悩んでいるときも、これで気軽に別の雰囲気の色が試せますね。文字タッチツール文字のアウトライン化をすることなく、一文字単位で文字の移動・回転ができます。今まで文字パレットの数値でいじっていたのを、感覚的にできるのでいいですね!しかも下位バージョンでデータを開くこともできるそう。残念ながら、こちらはCCのみ対応の機能となっています。段組み設定でグリッド分割し、さらにその分割したオブジェクトを段組み設定で結合。結合したオブジェクトに、ダミーの画像やテキストをアピアランスで適応...と、ものの数分でサクサクとワイヤーフレームができあがっていく様は圧巻でした...!段組み設定にこんな使い方があったんだなーと、一番印象に残った項目でした。Exporterや画像アセット(Photoshop)を使ったPNG/SVG/JPEGの書き出しスライスを使用せず、レイヤーやフォルダ単位で画像を書き出すことができます。レイヤー名(フォルダ名)を対応する名前に変えると、それにあわせた形式や解像度で書き出してくれるそうです!面倒だったスライス作業がなくなると、相当な時間短縮になるのではないでしょうか。こちら、CCから対応の機能です...。本当に残念です...。・Illustratorのこと以外にも、「Webデザイン」制作の動向も知れて、大変ためになりました。・鷹野さんのスライドの構成・デザインもわかりやすく、かつ遊びがあって素敵でした。・視点誘導に使用されていたスポットライト機能(Mouseposéというそうです)も、わかりやすかったです。ユーティリティ)・CCの機能っていろいろあるんだなーと、新機能を試すのが今から楽しみです。・使い慣れているつもりになっているソフトでも、知らない機能・活用方法がたくさん。・次回開催されるときには、またぜひとも参加したいです。コメントを残すショッピングサイトのまとめ4寒いのがもっと嫌いなhaneです。本当に、いろんな機能が低下してきます。第4回目は月々の利用料はおさえつつ、しっかりとした機能を利用できる「ショップサーブ」です。特徴ショップサーブは、株式会社Eストアーが運営するネット通販システムです。ネットショップ業界では老舗に入ります。比較しやすく、好感が持てます。メリット●ネットショップ成功ノウハウが学べる無料セミナーが実施されています。●オンラインで見られる図解入りのマニュアルが充実しています。●HTML、CSSが直接編集でき、デザインをカスタマイズできる範囲が広いです。デメリット●機能が豊富なので、無料期間の2週間では物足りないです。●一番下の料金プランでも、他社より高いようなイメージがあります。●ライトプランのみロイヤリティー(売上の5%)が発生します。●プランによってはスマートフォンサイトの最適化がオプション料金になっています。●基本的なhtmlの作りがtableで作られているため、多少扱いづらいです。権限の違いと複数管理者対応WORDPRESSの管理者権限には5つの種類があり、それぞれに投稿や編集に関する権限が違います。今回は、その権限の違いと、それを踏まえて複数の管理者が居る場合の対応についてです。5つの権限があります。『管理者』とは?WORDPRESSの全てに対して編集・管理できる権限を持ちます。『編集者』とは?記事に対しては編集や公開・削除など全ての権限を持ち、カテゴリやリンクなどの編集が行えます。『投稿者』とは?投稿者本人の記事を公開・管理する権限は持ちますが、ファイルをアップロードする事ができません。『寄稿者』とは?記事の投稿や自分の記事の管理はできますが、記事の公開やファイルのアップロードはできません。『購読者』とは?コメントの読み書きやメールマガジンを受け取る事はできますが、コンテンツに関わる事は一切できません。コメントを残す誰かに何かを伝えるときに意識することこんにちは!お日様が出ている時間もだいぶ短くなってきましたね。洗濯物が乾きにくくって困っているyasaiです。ちなみにすきな野菜は大根です。先日は大根と春菊のシチューを食べました。今日はちょっとWeb以外のお話を。皆さんも社内、社外に関わらず自分の考えていことや、何かの説明を自分以外の他者へ伝えることってあるのではないかと思います。お客様に更新方法の説明するとき。チームの人間にサイト構成と意図を説明するとき。身近に、友達に今日あったことの説明をしたいとき。自分の読んだ本の感想を伝えたいとき、今感じたことをどうしても伝えたいとき。いうときに、要領よくわかりやすく端的にまとめて話すことができたらよいのですが、僕はそういうことがとても苦手です。(言葉数が多くなってしまいます...)人と話をしていると、この人は話し方が上手だなぁとか、この人は言っていることは何となくわかるけど、伝え方が下手だなぁとか感じることってあると思います。今日は人に何かを伝えるのが苦手な僕が、なるべく気を付けるようにしていることをお話します。「なんの話か」をはっきり伝える。(5W1H)5W1Hなんてのはよく言われることですが。逆に話を聞く立場に立って考えてみましょう。相手が何かを話しているときに、自分の中で不足する情報は無意識のうちに推測or予測して補完して聞いていますよね。補完しながら、この人は「こういうこと」を言っているんだろう、って思いながら聞いているわけです。この時にそもそも相手から与えられなければ補完しようがない情報は推測しづらいと思うのです。補完できないので、「この人は何の話をしているんだろう」→「何言ってるかよくわからない」になるのですね。A「あの田中のシュートが入ってたらわかんなかったと思うんだよね。A氏がこのように話し始めたとします。今あなたはA氏が何の話をしていると思いましたか?サッカーでしょうか?このサッカーという部分が、あなたが今無意識のうちに推測して補完した部分です。このA氏の発言だけでは、これが何の話なのかよくわかりません。「サッカー」の話なのか、「バスケット」の話なのか、「いつ」の話なのか、「誰の」話なのか(田中選手はA氏の好きなチームの選手かもしれませんし、あなたのことかもしれません。したら、「シュート」は野球の球種なのかもしれません。A氏が話したかった内容の、バッググラウンドに当たる部分の説明が何もないので推測ができないのです。この発言だけでA氏の言いたい話を理解できるとすれば、それはあなたがA氏との間に、話のバックグラウンドを共有している場合になるでしょう。A氏の発言がこのようだったら、知らない人でも伝わったかもしれません。A「先週のサッカーの代表戦、あの田中のシュートが入っていたらわかんなかったと思うんだよね。「先週のサッカーの代表戦」を付け加えただけですが、ぐっと推測しやすくなりました。伝えることが苦手な人は、この相手に推測してもらうための情報をつけ忘れやすいのかもしれません。バッググラウンドは相手が共有しているだろう、というのは本人の思い込みかもしれません。バッググラウンドが共有しやすい友達や家族ならまだしも、社外の人間や同僚などにあなたのバッググラウンドの推測をすることはとても難しいことかもしれません。いうことで、僕が気を付けていることの1点目は、「自分がこれから何の話」をしようとしているかを意識的に伝える、です。相手のわかる言葉で話す20年も人生生きていると、ある程度自分の話し方ってかたまってきますよね。その話し方っていうのは、おそらく自分の中で一番聞きやすい話し方なのではないでしょうか?誰しもたいがいの誰かに何かを伝えたいという場面で、僕たちは一番伝わりやすいだろう方法、話し方を探すでしょう。同じ内容のレシピだったとしても、Aの方が理解しやすい人、Bの方がイメージしやすい人両方いると思います。理系の人、文系の人、直感的な人、理詰めな人、先に結論を言った方がわかりやすい人、順序立てて説明した方が理解しやすい人。人の理解する手順は十人十色なのだと思います。本題に入る前に、相手の話の癖をつかむことができる時間があるのなら、相手の話の組み立て方や結論の出し方を注意してみていると、相手に伝わりやすい言葉を探しやすいかもしれません。いうわけで、僕が意識していること2点目は、相手の理解しやすい言葉(この中には難しい専門用語は使わない、なども含む)で話す、ということです。相手がどう理解しようとしているのか、どういう風に聞こえているのか、そんなところに気を配りながらお話ができたら、わかりにくい話もちょっとは伝わりやすくなるのかな、と思います。書いてきましたが、それが今日の結論めいたものです。