Бүтээх · ГэрээWireframe · Дэлгэцийн бүдүүвч
Wireframe (дэлгэцийн бүдүүвч)
Wireframe бол өнгө, зураггүйгээр дэлгэц дээр юуг хаана байрлуулахыг л зурсан араг ясны бүдүүвч юм.
Интерьер хийхээс өмнө зурдаг давхрын план юм. Касс болон ширээний байрлалаас эхэлж шийднэ.
Арай дэлгэрэнгүй
Энэ шатанд дараалал, агуулгаа тогтоочихвол дизайн гарсны дараа бүхэлд нь эргүүлж өөрчлөх явдал багасна.
Өнгө, фонтод одоохондоо санаа зовох хэрэггүй. "Үйлчлүүлэгчийн хамгийн түрүүнд харах ёстой зүйл дээд талд байна уу", "Цаг захиалгын товч хүртэл хэдэн удаа дарах вэ" гэдгийг л харахад болно.
Wireframe, загвар хоёр юугаараа ялгаатай вэ?
Wireframe нь "юуг хаана байрлуулах вэ"-г тогтоох шат, харин загвар нь "яаж харагдуулах вэ"-г тогтоох шат юм. Wireframe-д зөвхөн саарал хайрцаг, текстийн байр л байдаг бол загварт өнгө · зураг · фонт орно.
Хоёр шатыг салгадаг шалтгаан нь засах зардал өөр байдагт оршино. Хайрцгийн дарааллыг солих нь хэдхэн минутын ажил ч загвар гарсны дараа дарааллыг өөрчилбөл зургийн хэмжээ, зай завсрыг хүртэл дахин тааруулах хэрэгтэй болдог.
Wireframe-ийг харахад өнгөгүй учраас хоосон юм шиг санагдах нь хэвийн зүйл. Энэ шатанд зөвхөн хайрцгийн дараалал, хэмжээг харж, өнгө төрх, уур амьсгалын яриаг загварын шат руу хойшлуулбал санал тань хамаагүй цэгцтэй болно.
Wireframe-ийн шатыг тусад нь хийдэггүй гүйцэтгэгч ч бий. Энэ үед анхны загвар wireframe-ийн үүргийг давхар гүйцэтгэдэг тул анхны загварыг авахдаа өнгөнөөс илүү дарааллыг нь эхэлж шалгах нь зүйтэй.
Хүснэгтийг хажуу тийш гүйлгэж үзэж болно
| Шат | Харах зүйл | Засах | Таны анхаарах зүйл |
|---|---|---|---|
| Wireframe | Хэсгүүдийн дараалал · товчны байрлал · хуудасны жагсаалт | Хамгийн амархан | Үйлчлүүлэгчийн хайсан мэдээлэл хурдан гарч ирж байгаа эсэх |
| Загвар | Өнгө · зураг · фонт · уур амьсгал | Дунд зэрэг | Бизнесийн тань өнгө төрхтэй таарч байгаа эсэх |
| Бэлэн дэлгэц | Бодитоор ажиллаж буй вэбсайт | Хамгийн хэцүү | Текст · холбоос · цаг захиалга зөв ажиллаж байгаа эсэх |
Wireframe-д юу юу ордог вэ?
Wireframe-д хуудасны жагсаалт, хуудас бүрийн хэсгүүдийн дараалал, товчны байр, хуудас хооронд шилжих зам ордог. Зураг зурах чадвар хэрэггүй. Дөрвөлжин хайрцагт "Гол зураг", "Үнийн жагсаалт" гэх мэт нэрийг нь бичихэд л хангалттай.
Олон дэлгэцээр үргэлжилдэг цаг захиалга, захиалгын урсгалд дэлгэц хооронд сум зурж өгвөл сайн. Ингэж дэлгэц болон урсгалыг хамтад нь зурсан зургийг "wireflow" гэж нэрлэх нь бий.
Текстийн байранд бодитоор орох өгүүлбэрийн уртыг ойролцоогоор тааруулж өгвөл сайн. Нэг мөрийн байранд таван мөр танилцуулга орвол загвар дээр байрлал дахин алдагддаг учраас тэр.
Wireframe нь нэг л удаа гүйлгэж үздэг лэндинг вэбсайтад ч хэрэгтэй. Нэг хуудас байсан ч дээрээс доош явах дараалал нь үйлчлүүлэгчийн явах зам болдог учраас тэр.
- Хуудасны жагсаалт: Нүүр · Танилцуулга · Цэс · Байршил гэх мэт ямар хуудас хэдэн ширхэг байх
- Хэсгүүдийн дараалал: нэг хуудас дотор дээрээс доош юу юу гарах
- Үйлдэлд уриалах товч: утас · цаг захиалга · лавлагааны товч хаана, хэдэн удаа гарах
- Шилжих зам: товч дарахад аль дэлгэц рүү очих
- Утасны байрлал: компьютер дээр хажуу хажуудаа байгаа нүднүүд утсан дээр ямар дарааллаар давхарлагдах
Wireframe-ийг өөрөө яаж зурж үзэх вэ?
Нэг хуудас цаас, үзэг байхад л 30 минутын дотор ноорог гаргаж болно. Дараалал нь тодорхой байвал гүйцэтгэгчтэй хийх анхны зөвлөгөө хамаагүй богино болдог.
Зураг цэвэрхэн байх албагүй. Гүйцэтгэгч зурах ур чадвараас илүү "юу эхэлж гарах вэ", "юу заавал байх ёстой вэ" гэдгийг уншиж авдаг. Компьютер тань дөт бол илтгэлийн программ дээр дөрвөлжин хайрцаг тавьж болно, цаасан дээр зурснаа зургийг нь дарахад ч хангалттай.
- 01Үйлчлүүлэгчид утсаар эсвэл мессежээр хамгийн их асуудаг 5 асуултыг бич.
- 02Тэдгээрийн хариултыг багтаах хуудасны жагсаалт гарга. Жижиг бизнест ихэнхдээ нэг хуудас хангалттай байдаг.
- 03Утасны дэлгэцийн хэмжээтэй босоо урт дөрвөлжин зурж, асуултуудын хариултыг чухлын дарааллаар дээрээс нь эхлэн хайрцгаар дүүргэ.
- 04Үйлчлүүлэгчийн эцэст хийх үйлдлийг (цаг захиалга · утсаар залгах · зам хайх) тогтоож, товчны хайрцаг зур.
- 05Таалагдсан өөр бизнесийн вэбсайтын дэлгэцийн зургийг авч, "энэ хэсгийн дараалал таалагдсан" гэж бичээд хавсарга.
- 06Зурсан зургаа зургийг нь дарж гүйцэтгэгч рүү илгээгээд, дутуу мэдээлэл байгаа эсэхийг хамтдаа шалга.
Салбараас хамаарч эхний дэлгэцийн дараалал хэрхэн өөрчлөгдөх вэ?
Эхний дэлгэцийн дараалал салбараас илүүтэй "үйлчлүүлэгч орж ирээд хамгийн түрүүнд юуг мэдэхийг хүсэж байна вэ" гэдгээс шалтгаалдаг. Ижил үсчин байсан ч цаг захиалгаар ирдэг үйлчлүүлэгч олонтой газар, замаар явж байгаад ордог үйлчлүүлэгч олонтой газрын дараалал өөр байна.
Доорх жишээ бол зөвхөн эхлэл цэг. Бодит байдал дээр бизнест тань хамгийн их ирдэг асуултыг үндэслэн өөрчилж ашиглаарай.
Дарааллаа тогтооход хэцүү байвал бизнес рүү тань ирэх дуудлагыг ердөө нэг долоо хоног тэмдэглэж үзээрэй. "Хэдэн цаг хүртэл ажилладаг вэ?" гэсэн асуулт хамгийн их байвал ажлын цагийг, "Машин тавих газар бий юу?" гэсэн асуулт их байвал зогсоолын мэдээллийг эхний дэлгэц рүү ойртуулахад л болно.
- Үсчин: гол загварын зураг → дизайнерийн танилцуулга → үйлчилгээ тус бүрийн үнэ → цаг захиалгын товч → байршил · зогсоол
- Урлан: гол бүтээлийн зураг → хичээлийн төрөл ба хуваарь → сургалтын төлбөр → бүртгүүлэх товч → суралцагчдын сэтгэгдэл
- Хоолны газар: гол цэсийн зураг → ажлын цаг · амралтын өдөр → цэс → бүлгийн захиалгын лавлагаа → газрын зураг
- Пилатес · Йог: хичээлийн уур амьсгалын зураг → хичээлийн төрөл → цагийн хуваарь → туршилтын хичээлд бүртгүүлэх → багшийн танилцуулга
Утасны дэлгэцийн wireframe-ийг тусад нь харах хэрэгтэй юу?
Тийм, утасны дэлгэцийн дарааллыг тусад нь шалгах нь зүйтэй. Компьютер дээр зүүн, баруун талд зэрэгцэн байрласан нүднүүд утсан дээр дээш доош давхарлагддаг бөгөөд аль нүд нь эхэлж гарахаас шалтгаалж үйлчлүүлэгчийн харах дараалал огт өөр болдог.
Google хайлтын индекс үүсгэхдээ голдуу хуудасны мобайл хувилбарыг үндэслэдэг гэж зааварчилсан байдаг. Тиймээс утасны дэлгэц дээр чухал агуулга дутах, нуугдахгүй байхаар эхнээс нь хамтад нь төлөвлөх нь найдвартай.
Утасны wireframe дээр цаг захиалга · утасны товч эрхий хуруугаар дарахад тохиромжтой газар байгаа эсэх, үнийг харахын тулд хэт удаан гүйлгэх шаардлагагүй эсэхийг харахад л болно.
Утасны wireframe дээр гүйлгэхгүйгээр харагдах эхний дэлгэцийн хүрээг бас шалгаж үзээрэй. Тэр хэсэгт бизнесийн нэр, юу хийдэг газар болох нь хамт багтаж байж үйлчлүүлэгч шууд гараад явахгүй.
Wireframe-ийн шатанд ямар алдаа их гаргадаг вэ?
Хамгийн түгээмэл алдаа бол wireframe-ийг өнгөц харж өнгөрөөгөөд, загвар дээр дарааллыг дахин өөрчлөх явдал. Ингэвэл засварын тоо, хугацаа хоёулаа нэмэгддэг.
Өөр нэг алдаа бол оруулахыг хүссэн бүх агуулгаа эхний дэлгэцэд тавих явдал. Эхний дэлгэц бол үйлчлүүлэгч "зөв газраа ирсэн үү" гэдгээ шийддэг хэсэг учраас мэдээллийг 3–4 болгож цөөлөх тусам харин ч сайн уншигддаг.
Эсрэгээрээ хуудсыг хэт жижиглэн хуваах нь бас түгээмэл алдаа. Жижиг бизнесийн мэдээлэл олон хуудсанд тархвал үйлчлүүлэгч цэсээр нааш цааш явсаар гараад явах нь амархан тул нэг хуудсанд төвлөрүүлж, дээд хэсэгт нь шууд очих товч байрлуулах нь илүү дээр байх тохиолдол олон.
Wireframe-ийн шатанд гүйцэтгэгчээс юу асуух вэ?
Гэрээ хийхээс өмнө эсвэл анхны уулзалт дээр доорх дөрвөн зүйлийг асуувал засварын тоо, хугацаа тодорхой болно.
- Wireframe-ийн шат тусдаа байдаг уу, эсвэл шууд загвар руу ордог уу
- Wireframe-ийн шатны засвар нийт засварын тоонд багтах эсэх
- Утасны дэлгэцийн байрлалыг бас хамт харуулах эсэх
- Wireframe-ийг баталгаажуулсны дараа дарааллыг өөрчилбөл яаж шийдэх
Жишээлбэл
- Кафены эхний дэлгэц: үндсэн зураг → нэг өгүүлбэр танилцуулга → 3 цэс → байршил · ажлын цаг → цаг захиалгын товч гэсэн дарааллыг зөвхөн хайрцгаар зурж үзнэ.
Үүнийг л шалгаарай
- Бизнест хамгийн их ирдэг асуултын хариулт дэлгэцийн дээд хэсэгт байгаа эсэх
- Хуудас бүрт үйлчлүүлэгчийн хийх үйлдэл (цаг захиалга · утасны дуудлага · лавлагаа) нэг нэгээр тодорхойлогдсон эсэх
- Орхигдсон хуудас эсвэл давхардсан агуулга байхгүй эсэх
Манай бизнест?
Олон хуудастай, эсвэл цаг захиалга · захиалга гэх мэт урсгалтай вэбсайт бол ялангуяа тус болно.
ISSYMO-д
Уулзалтаар тохирсон бүтцийн дагуу дэлгэцийн дарааллыг эхэлж гаргаж, дараа нь загвараа үзүүлнэ.
Түгээмэл асуулт
Ашигласан эх сурвалж
Сүүлд зассан өдөр