ワイヤーフレーム

エクストーンの松本です。 ワイヤーフレームをどのツールを使って作るかについては、多様な意見があるところかと思います。昔はオフィス系ツール以外の選択肢があまりなかったように思いますが、最近ではデザイン系ツールやオンラインのコラボレーションツールなどが続々と登場し、かなり選択肢が増えてきました。 エクストーンでは以前はパワーポイントを主に使用していましたが、最近はFigmaを使うケースが増えてきました。今回はワイヤーフレームを作成する上で抑えるべきポイントと合わせて、Figmaを利用するメリットについて書いてみたいと思います。 ワイヤーフレームに求められること まず大前提として、ワイヤーフレームは…

一応、華金って言葉くらい知ってますし、使います(＾ω＾) とくに何かあるわけではないですが...... あ！それと、購読いただいたみなさま、星★ありがとうございます！！ めちゃくちゃ嬉しかったです！！ 人に晒す日記なので不快に思われないようなレイアウトを心掛けたいと思います。 機能もよく分からないためどうしたらいいかも分からず...... 近々どんな機能が備わっているか散策いたしますm(__)m まだまだ初心者ですので温かく見守っていただけたら幸いです♡ 先日、練習して習得したワイヤーフレームの書き方、簡単ではあるけど完成させられてウキウキしてたら、今日授業で「実際にワイヤーフレームを書いてみ…

Figmaでスマホサイトの画面構成（今どきはワイヤーフレームって言うのかな）を作成している時に、壁にぶち当たった。 ヘッダー部分を縦にスクロースしても常時表示されるように固定したかったのに、できない。 「スクロール位置を固定」のチェックボックスは何処へ？ 「スクロール時に位置を固定（Fix position when scrolling）」のチェックボックスが表示されないのですよ。 「スクロール時に位置を固定（Fix position when scrolling）」のチェックボックスが表示されない いくらgoogleで検索してもyahooで検索しても（同じか）理由がわからない、答えが見つから…

デザインカンプから作ることってあるのかな？ とふと思ったり。 ワイヤーフレームって「ホームページの要素の配置を決める」ってのが主な目的だと思っていたんだけど、必ず必要なのかってのがわからなかった。 お客さんと手書きしながら決めていくってケースもあるみたいなのですが、ケースバイケースなのかな。 何も決まっていない時は必要な気がするけど、ある程度ひな形が決まっているならワイヤーフレームが無くても作れそうな気がしてしまうのは自分だけかな。 いろいろ考えてしまうなぁ。 でも「ワイヤーフレームを作れるようになるのは大事」ってことだけは理解した。 必要かどうかに限らずWEBデザインをやるには必要なスキル。

よく初心者が疑問にわく、「ウェブサイトとホームページ」の違いってなにかご存じでしょうか？ もしかして目から鱗かもしれません。 ウェブサイトとホームページの違い ウェブサイトとホームページとの「違い」は何でしょうか？ ウェブサイトと言った場合は、複数のページからなる全体を総称して「ウェブサイト」といいます。個々のページについては、ウェブサイトと比較して単にウェブページと呼ぶことがあります。 つまりウェブサイトには、ウェブページとしてトップページがあったり、新着情報ページがあったり、お知らせのページがあったりこれらを全体を指すワードなのです。 対して、ホームページという言われ方をする場合もあります…

【ワイヤークラフト★テストスキル★】 ワイヤークラフトに”基本”なんてありません ”基本”は無くても『知識』はあった方が良いです！ ワイヤークラフトの初心者の方 或いは、これから…と思案中の方に向けて 参考にして頂けるような針金細工の 「テストスキル」を紹介します 初級から上級編まで⑤回に渡ってお届けします 今回の記述は第1回【初級編】 以下の画像を参考に(小学生にも出ます) 是非！ご自身の技量”をお試し下さい。 ～～～～～～～～～～～～～～～～～～ 【テストスキル①】《初級編》 素材は100円ショップで販売されている 安価なアルミ線を使っています ワイヤーの太さは 1～2mmφ ほぼ…1mm…

どうも、まさとらん（@0310lan）です！今回は、Webサイトの構造を可視化して直感的に理解しやすい「ビジュアルサイトマップ」を作成できるWebサービスをご紹介します。ブラウザからGUIベースのエディタにアクセスするだけで誰でも利用可能で、すべてマウス操作でできるので初心者でも簡単に使いこなせます。ブロックを追加していくだけでサイトマップに簡易的なワイヤーフレームが挿入できる点がとても便利です。また、既存のWebサイトから素早くサイトマップに変換する方法も合わせて解説しているので、ご興味のある方はぜひ参考にしてみてください！ 【 Octopus.do 】 ■「Octopus.do」の使い方 …

本記事は Webデザイン事業部ウィーク 2024 5日目の記事です。 🌈 4日目 ▶▶ 本記事 ▶▶ 💐 こんにちは。Webデザイナーの和田です。 みなさんは顧客との打ち合わせ資料や社内外での勉強会向けのプレゼン資料を作る時など、PowerPoint（以降パワポ）やMacの方ならkeynoteを使っていませんか？ 私はこの数ヶ月間、資料作成が必要な時は意識的にFigma/Figjamを使って資料を作っていました。 そもそも、Figma/Figjamを使ってみよう！と思うきっかけは、日頃のデザイン制作でFigma/Figjamを活用しており、「デザイン以外での用途でも使えるなこれは！」と思って始…

Webデザインにおける重要な要素であるワイヤーフレーム。本ガイドでは、最新のWEBデザインワイヤーフレームの作り方について詳しく解説していきます。ワイヤーフレームの基本的な概念から、その重要性やメリット、作成のポイントや注意点まで幅広くカバーしていきます。 また、ワイヤーフレームを活用する際のデザインテクニックやベストプラクティス、ユーザーエクスペリエンス（UX）を考慮した作成方法、さらにはデザインシステムとの統合の有用性についても詳しく紹介します。 さらに、ワイヤーフレーム作成のフィードバックや改善方法、効果的なクライアントとのコミュニケーション方法、テストや評価手法、さらには効率化のコツや…

今回は ビルボードになります。ビルボードとは何なのか、まったく知識が無い状態で始めたのでこのテストもゼロからの構築となりました。ビルボードは比較的Web上に多く情報があった為参考になりました。 今回参考になったサイトは以下です。 ①「指定の形状が視線方向を向くようにしたい （スクリプト）」Shade3Dというプラットフォームでの実装ですが、自分が最も望んでいる内容でした。途中で切り上げてしまった為ちゃんと動作は確認していません。いずれしたいと思っています。 // ビルボードの表示テストHOUZMETHOD_VD text_out_effect_t::billboard_main_test( c…

WEBデザインを始める初心者の方にとって、適切なパソコンを選ぶことは非常に重要です。パソコンは制作活動の中心となるツールであり、スムーズな作業を行うためには適切な機種を選ぶことが必須です。この記事では、WEBデザイン初心者向けにパソコンの選び方からスペックのポイント、おすすめの機種まで、しっかりと解説していきます。自分に合った最適なパソコンを選ぶための5つのステップを追ってみましょう。 適切なパソコンの選定は、WEBデザイン作業の効率と品質に直結する重要なポイントです。パソコンは作業の中心と なるため、スペックや機能が作業効率に大きく影響します。 例えば、処理能力が低いパソコンでは、作業が遅く…

ヒープ領域とスタック領域 スタック領域はサブルーチンの戻りを格納する領域。ヒープは動的に割り当てられる。 安全余裕率 損益分岐点分析でA社とB社を比較した記述のうち，適切なものはどれか PDM 製造のためのデータ（製造情報）をシステムで一元管理する ペトリネット 並列システムの分析 システム化構想の立案 要件定義よりももっと前の段階 ポリモーフィズム型マルウェア ポリモーフィック型マルウェアの説明として，適切なものはどれか。 ポリモーフィック＝多様な形。パターンマッチングによるウイルスチェックにひっかからないように、それぞれ別のコードを割り当てる。 データディクショナリ 開発者側で定義している…

Webデザインを独学で始めるにあたり、正しい学習方法やツール選び、カラーコーディネーション、UXデザインの基礎、さらに成功するためのヒントまで多岐にわたる知識が求められます。 この記事では、初心者から上級者まで幅広く活用できる、WEBデザインの攻略法をご紹介します。オンラインコースと書籍の比較から、実務経験の重要性、PhotoshopやIllustratorの適切な使い分け、カラーホイールの活用方法、UXデザインの基本、さらにはよくある質問や回答まで、全てのステップを丁寧に解説します。 これらの情報を実践に活かすことで、Webデザインの世界で自信を持って活躍できるスキルを身につけることができま…

クリスタにはパース定規がありますが、そもそもパースというものに慣れていないとなかなか難しいですよね。そこで便利なのが3Dの補助素材です。 3Dレイヤーにはパース定規が付いている パースの補助になる3D素材

お題「この前読んだ本」 内容紹介（「BOOK」データベースより）本書は、初めてＦｉｇｍａを使用する人、もしくは一度Ｆｉｇｍａを使用したけれども諦めてしまった人が、Ｆｉｇｍａを操作するうえで迷わず効率的にひと通りの操作が行え、成果物が得られることをゴールとしたレッスンで構成しています。基礎編では、Ｆｉｇｍａの概要やアカウントの作成方法、画面構成、共同編集といったＦｉｇｍａを利用する際に知っておくべき前提知識、基本的な操作方法を解説しています。実践編では、Ｗｅｂ・ＵＩデザインはもちろん、Ｉｎｓｔａｇｒａｍ広告のバナーやＹｏｕＴｕｂｅのサムネイル、プレゼン資料・名刺といった紙のデザインまで、幅広いデ…

WEBデザインスクールで学ぶ魅力と成功する方法について、さまざまな視点から解説していきます。 WEBデザイン業界に足を踏み入れるための第一歩とも言えるスクール選びから、実務で必要なスキルや技術の習得方法、そして将来のキャリアアップにつながる学び方まで、様々な情報をお伝えします。WEBデザインスクールの特徴や選び方、学ぶことのメリット、料金設定や奨学金制度、実務に役立つ技術やスキル、そしてよくある疑問にお答えするまで。 WEBデザインの世界への一歩を踏み出すための貴重な情報が満載です。 【PR】Webデザイナーを目指す方におすすめのWebデザインスクール！ 副業・フリーランスのWebデザイナーを…

github.com 同期ビューポート ZBrushのサムネイルビューにインスパイアされたこのアドオンは、作業中にスカルプトの同期されたシルエットビューを表示することができます。 たまに欲しくなる機能だ！ ビューポート同期ができる無料アドオン。 任意でオン・オフできるのが良いね。 ヘッダー領域にある切り替え可能なボタンを使って、ビューポートを選択的に同期させることができます。 同期されるのはビューのみで、他は通常通り個別に設定できます。 例えば、2つのビューポートを同期して、一方はワイヤーフレームを表示し、もう一方はマテリアルのプレビューを表示することができます。 すべてのオブジェクトモードで…

Blenderって本当に奥が深くて、使いこなすまでが一苦労ですよね。でも、ちょっとしたコツとショートカットキーを覚えるだけで、かなり作業効率が上がります。今日はビビさんのBlenderを使用したクマのキャラクターモデリングの動画から、特に役立つ操作とショートカットキーをご紹介します。これをマスターすれば、あなたもBlenderの魔法使いに一歩近づけるはず！ キャラクターモデリングの基本操作 1. ライトとカメラをポイ！: 最初に、ジャマなライトとカメラは`X`キーでサッと消し去りましょう。まずは邪魔なものを取り除いてスッキリさせます。 2. サブディビジョンサーフェスでスムース化: `Ctrl…