ファッション誌「MEN’S NONNO」の
WEB版を作成しました
雑誌をWEBの記事として再構築。
雑誌のイメージを守りつつ、
WEBらしさをプラスしながらレイアウトやデザインを作成しました。
作品のPOINT
POINT01
集英社MEN’S NON-NOの誌面をもとにＷeb記事を作成しました。（サイトそのものの制作ではありません！）
雑誌のWEB版ですからさまざまなジャンルの記事を作成しますが、
こちらはその一例で、吉岡里穂さんと中村倫也さんのインタビューです。
誌面のイメージを保ちつつ、Webで読みやすい構成に再調整します。
例えば、吉岡さんと中村さんの顔写真を向き合うようにレイアウトし、
対談している雰囲気が出るよう工夫しています。
お二人の顔回りにＣＳＳで吹き出し風のあしらいを施し、
お話している雰囲気も出しています。
また、誌面ではインタビュー内容は長文で続くのですが、
このWeb記事ではインタビューの合間に劇中アニメカットを挿入し、インタビューに躍動感が出るよう工夫しました。
POINT02
制作内容はざっとこんな感じです。
誌面をもとに、WordPressの投稿機能を用いて記事作成します。
●校了データから写真素材やテキスト抽出。（InDesign)
●写真素材のレタッチ、リサイズ。（Photoshop)
●Web記事のためのアイコンなどの素材制作。（Illustrator）
●紙面をもとに再レイアウト。
●記事制作（WordPress、HTML、CSSコーディング）
さまざまなツールを使って、素材準備～記事作成～校正まで1つの記事を一人で完成させます！
POINT03
特にスマホでの見た目を意識して制作します。
見開きで読める雑誌の誌面を縦スクロールのスマホで読みやすくかつ魅力的に見せるためには
誌面と大きくレイアウトを変える必要があるからです。
コーディングする際も、レスポンシブに特に注意を払い、複数のメディアクエリを入れることが多かったです。
制作時期
参加フェーズ
サイトを見る
