ショッピングサイト ～音楽情報・メディアの発信～ 北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 0421104 金子拓磨 問題提起・研究動機 • PHPを用いた技術の研究 – Webサービスに対応した技術 • 様々なツールを組み合わせたウェブデザインの模索 – ユーザーに積極的に働きかけるデザイン • “音楽”というメディア情報への興味 – ユーザーへの情報発信 • WDCへの参加 – デザイン力の挑戦 音楽メディアを対象としたショッピングサイトの作成 開発手順（１） 1. ラフスケッチ – サイトの構成の模索 2. 機能・デザインの絞込み 3. サイトの作成 a. 機能面の作成 • スクリプトを使用 – PHP PHP – – HTML – – b. デザイン面の作成 • 骨組み – • デザイン – • HTML etc CSS 動的にＷｅｂページを生成するＷｅｂサーバ 拡張機能の一つ。また、そこで使われるスク リプト言語。 レイアウトの「雛形」となるHTMLファイル内 に、処理内容を記述したスクリプトを埋め込 み、処理結果に応じて動的に文書を生成し 、送出することができる。 IT用語辞典 - PHP Webページを記述するためのマークアップ言 語。W3Cが作成している規格で、最新版は HTML 4.01。 HTMLは文書の論理構造や見栄えなどを記 述するために使用される。また、文書の中に 画像や音声、動画、他の文書へのハイパーリ ンクなどを埋め込むこともできる。 IT用語辞典 - HTML CSS (Cascading Style Sheets) – – Webページのレイアウトを定義する規格。 これまで、WebページのレイアウトはHTMLを 用いて記述され、HTMLにはレイアウトに関 する仕様が大量に取り込まれたが、これは、 文書の論理構造を記述するという本来の HTMLの目的に反するため、文書の視覚的 構造を規定する枠組みとしてCSSが新たに 策定された。 IT用語辞典 - CSS 開発手順（２） 4. 機能面とデザイン面を統合 5. 手順2～3の繰り返し • 完成度の向上 1.ラフスケッチ 2.機能デザインの絞込み 繰り返し 3.サイトの作成 a.機能面 b.デザイン面 4.統合 研究計画 • サーバースペースの確保 – レンタルサーバー • サイトの作成 • WDCへの提出 • 完成度の向上 – 機能の追加 – デザインの向上 目標 • WDC最優秀賞入賞 • ウェブデザイン知識の向上 – CSS – PHP – Etc… 開発成果 ラフスケッチ • 方向性の決定 – 架空の音楽メディア販売サイト • サイト構成の決定 ユ ー ザ ー サ イ ド 管 理 サ イ ド トップページ 商品一覧 商品の詳細 カート 注文 •お知らせ ログインページ /管理ページ カテゴリメンテ •管理メニュー 商品メンテ カートに追加 開発成果 機能・デザインの絞込み • 機能の絞込み – 必要最低限の機能 • 商品リスト • ショッピングカート • 注文 • 商品情報管理 • 注文情報管理 • デザインの絞込み – 必要最低限のデザイン • タイトル • カテゴリリスト • コピーライト • 商品情報 開発成果 サイトの作成 準備 • サーバースペースの確保 – さくらインターネット • http://notequal.sakura.ne.jp/cd_shop/ • 開発ツール – Apache HTTP Server 1.3.26 • Webサーバープログラム – http://www.apache.jp/ – PHP 4.2.2 • PHP本体 – http://www.php.net/ – TeraPad • テキストエディタ – http://www5f.biglobe.ne.jp/~t-susumu/ 開発成果 サイトの作成 機能 • 商品カテゴリ・商品リストの表示 – 関数の自作 • 自作関数ファイルの作成 – データファイルの作成 • ジャンルデータ – カテゴリ判別用 – 商品判別用 • アーティストデータ – カテゴリ判別用 – 商品判別用 • 商品データ 開発成果 サイトの作成 機能 • 動作テストデータの入力 – 仮情報を手動で入力 • カテゴリリスト仮情報 – ジャンル • ロック • ジャズ • クラシック – アーティスト • • • • • • METTALICA CREAM マイルス・ディヴィス 武満徹 バッハ ワーグナー 開発成果 サイトの作成 デザイン • HTML文書の作成 – サイトの骨組み • CSSの記入 – サイトのデザイン 評価・考察 • 機能面 – ジャンル/アーティスト別の商品リストの実現 →他項目による商品リストも実現可能か • デザイン面 – デザインが淡白 →今後さらに改良 今後の課題 • 機能面 – データファイル管理周辺の強化 • 様々な機能追加への対応準備 • デザイン面 – 見栄えのあるデザインの検討 参考資料 • 書籍 – 10日でおぼえるPHP入門教室 • (株)オフィスエム 著 • 翔泳社 刊 • Webサイト – Amazon.co.jp – @TOWER.JP – HMV Japan – Disk union.net
© Copyright 2024 ExpyDoc
