Try   HackMD

SiteMap - 購物/會員 (哲賢、軒園)

tags: SiteMap

AUSTIN

    • 購物車頁面(MAIN)參考

      • 頁面架構
        (上方:使用 swiper ;
        下方:使用 Grid 商品一排四格瀑布流)

        • lativ
          Image Not Showing Possible Reasons
          • The image file may be corrupted
          • The server hosting the image is unavailable
          • The image path is incorrect
          • The image format is not supported
          Learn More →

      • 參考動畫
        (上方:swiper 輪播 ;
        下方:hover 圖片 變淺色、放大，
        hover 商品名稱 字底線動畫)

        • highsnobiety
          Image Not Showing Possible Reasons
          • The image file may be corrupted
          • The server hosting the image is unavailable
          • The image path is incorrect
          • The image format is not supported
          Learn More →

      • 內容資訊
        (上方:介紹主要類別圖片xN ;
        下方:商品主要圖片x1、商品名稱、商品價格)

    • 購物車內頁(MAIN)參考

    • 頁面架構
      (左側:條列式資訊 ;
      右側:商品圖片)

      • 吉豐重工
        Image Not Showing Possible Reasons
        • The image file may be corrupted
        • The server hosting the image is unavailable
        • The image path is incorrect
        • The image format is not supported
        Learn More →

    • 參考動畫
      (左側:縱向滑鼠滾輪 ;
      右側:橫向swiper 用鍵盤移動多張圖片)

      • 吉豐重工
        Image Not Showing Possible Reasons
        • The image file may be corrupted
        • The server hosting the image is unavailable
        • The image path is incorrect
        • The image format is not supported
        Learn More →

    • 內容資訊
      (左側:名稱、價錢、簡介、尺寸、數量、加入購物袋 ;
      右側:商品其他圖片xN)

    • 送養內頁(MAIN)參考

    • 頁面架構
      (上方:nav ;
      主頁:內文)

      • 送養
        Image Not Showing Possible Reasons
        • The image file may be corrupted
        • The server hosting the image is unavailable
        • The image path is incorrect
        • The image format is not supported
        Learn More →

    • 內容資訊
      (內文;
      Input:種類、名字、圖片、敘述、聯繫方式)

      • 送養內文
        Image Not Showing Possible Reasons
        • The image file may be corrupted
        • The server hosting the image is unavailable
        • The image path is incorrect
        • The image format is not supported
        Learn More →

        )

LIMO

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

參考設計(:eyes: LIMO自己要看的):
https://dribbble.com/tags/organic_shop
https://www.esquire.com/style/mens-fashion/g20686368/best-cheap-online-clothing-stores-for-men/

1. 購物車頁面(nav)參考

  • 購物車圖示
    • 顯示於畫面右上方
    • HOVER效果展開(提供資訊)

加入購物車//lativ

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →



HOVER//SOMETHING
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →



2. 商品頁面(nav)參考

  • 購物頁面圖示
    • 可預選商品分流
    • HOVER效果展開(主要分流)
    • 展開清單(細節分類)
    • 圖文顯示/置入廣告(皆為跳轉畫面)

選擇商品分類//link1 link2

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →



Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →


Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

選擇身分分類//link

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More → 

​​​​  - 補充 -
效果表
圖示HOVER顯示 點擊加入購物車
尚未購物 購物車目前沒東西 |
已選購者 購物車
(商品+基礎細節+數量)		 上方顯示
加入資訊小卡
顯示數秒後消失(提示加入成功)
  • 購物流程
    • 購物歷程
      • 點擊連結至商品頁面- 選擇目標商品- 加入購物車
      • 跳轉購物車清單- 修改購物車- 選擇結帳方式
      • 確認商品及付款方式
      • 登入- 再確認(若已登入則省略)- 完成訂單(提示
    • 購物後行為
      • 確認已下訂單- 確認訂單進度 - 訂單完成確認(收到貨款)
      • 存入歷史紀錄

3. 登入頁面(nav)參考

  • 登入頁面圖示
    • 放置於最右側(購物車之前)
    • 以純文字為主之按鍵
    • 具有標誌性底色

上方NAV簡潔分層//link1 link2 link3

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →



Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →



Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

其餘參考介面

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

4. 登入頁面方向

送養系統
(CRUD)

認養紀錄
(僅提供資訊)

購物紀錄
(來自購物流程)

留言板系統
(表單對話 1V1)

Last changed by 
 
好ㄘのBen當
中興大學大數據的奴隸之少爺的專題小組
0
157

Read more

專題資料夾

Google Drive 專題資料夾 簡報資料夾 簡報PDF pet vogue 共用 google 帳號： 帳號：petvogue2021@gmail.com 密碼：petvogue0311 僅提供專題使用

Sep 2, 2022
載入SQL資料

KKKKK

Jul 7, 2021
檢核表

[ ] 首頁 確認清單 FRONT 頁面 套版 資料 圖片 功能

Jun 23, 2021
個頁面css JS route

donate web route // Donate Front Controller Route::prefix('/donate')->group(function (){ // 顯示首頁 Route::get('/','DonateFrontController@index'); // 顯示捐款頁 Route::get('/cash','DonateFrontController@cash'); // 傳送捐款資料

Jun 22, 2021
Read more from 好ㄘのBen當
Published on HackMD