HeaderSIS.jpg

Difference between revisions of "IS480 Team wiki: 2012T1 6-bit PD User Interface Prototype"

From IS480
Jump to navigation Jump to search
 
(10 intermediate revisions by the same user not shown)
Line 2: Line 2:
 
<div class="center" style="width:60%; margin-left:auto; margin-right:auto;">'''6-bit's Chapalang!''' is a social utility that connects people with friends and new friends <br> by offering a place for exchanging ideas and information on its public domain. <br> http://www.chapalang.com
 
<div class="center" style="width:60%; margin-left:auto; margin-right:auto;">'''6-bit's Chapalang!''' is a social utility that connects people with friends and new friends <br> by offering a place for exchanging ideas and information on its public domain. <br> http://www.chapalang.com
 
</div>
 
</div>
<font face="Arial" size="3">
+
<font face="Calibri">
 
<!--Navigation-->
 
<!--Navigation-->
 +
{| style="background-color:#ffffff; color:#000000" width="100%" cellspacing="0" cellpadding="8" valign="top" border="1" |
 +
 +
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:110%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Final_Wikipage | <font color="#FFFFFF"><b>Final Wikipage</b></font>]]
 +
 +
|}
 
{| style="background-color:#ffffff; color:#000000" width="100%" cellspacing="0" cellpadding="8" valign="top" border="0" |
 
{| style="background-color:#ffffff; color:#000000" width="100%" cellspacing="0" cellpadding="8" valign="top" border="0" |
  
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:90%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit | <font color="#FFFFFF"><b>Home</b></font>]]
+
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:110%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit | <font color="#FFFFFF"><b>Home</b></font>]]
  
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:90%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Technical_Overview | <font color="#FFFFFF"><b>Technical Overview</b></font>]]
+
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:110%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Technical_Overview | <font color="#FFFFFF"><b>Technical Overview</b></font>]]
  
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:90%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Project_Deliverables | <font color="#FFFFFF"><b>Project Deliverables</b></font>]]
+
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:110%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Project_Deliverables | <font color="#FFFFFF"><b>Project Deliverables</b></font>]]
  
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:90%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Project_Management | <font color="#FFFFFF"><b>Project Management</b></font>]]
+
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:110%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Project_Management | <font color="#FFFFFF"><b>Project Management</b></font>]]
  
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:90%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Learning_Outcomes | <font color="#FFFFFF"><b>Learning Outcomes</b></font>]]
+
| style="filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0066', endColorstr='#FF0066'); background: -webkit-gradient(linear, left top, left bottom, from(#FF0066), to(#FF0066)); background: -moz-linear-gradient(top,  #FF0066,  #FF0066); font-size:110%; text-align:center; color:#ffffff" width="10%" | [[IS480_Team_wiki:_2012T1_6-bit_Learning_Outcomes | <font color="#FFFFFF"><b>Learning Outcomes</b></font>]]
  
 
|}
 
|}
 
{| style="background-color:#ffffff; border-bottom: 3px groove #FE2E64; color:#000000" width="100%" cellspacing="0" cellpadding="4" valign="top" border="0" |
 
{| style="background-color:#ffffff; border-bottom: 3px groove #FE2E64; color:#000000" width="100%" cellspacing="0" cellpadding="4" valign="top" border="0" |
  
| style="font-size:90%; text-align:center; color:#FE2E64" width="10%" |[[IS480_Team_wiki:_2012T1_6-bit_PD_Technical_Diagrams|<font color="#CD004E"><b>Technical Diagrams</b></font>]]
+
| style="font-size:110%; text-align:center; color:#FE2E64" width="10%" |[[IS480_Team_wiki:_2012T1_6-bit_PD_Technical_Diagrams|<font color="#CD004E"><b>Technical Diagrams</b></font>]]
  
| style="font-size:90%; text-align:center; color:#FE2E64" width="10%" |[[IS480_Team_wiki:_2012T1_6-bit_PD_User_Interface_Prototype|<font color="#CD004E"><b>User Interface Prototype</b></font>]]
+
| style="font-size:110%; text-align:center; color:#FE2E64" width="10%" |[[IS480_Team_wiki:_2012T1_6-bit_PD_User_Interface_Prototype|<font color="#CD004E"><b>User Interface Prototype</b></font>]]
 +
 
 +
| style="font-size:110%; text-align:center; color:#FE2E64" width="10%" |[[IS480_Team_wiki:_2012T1_6-bit_PD_Business_Intelligence_and_Analytics|<font color="#CD004E"><b>Business Intelligence and Analytics</b></font>]]
 
|}
 
|}
  
Line 27: Line 34:
 
<br>
 
<br>
 
=<div style="background: #FF0080; background: -webkit-gradient(linear, left top, left bottom, from(#FF0080), to(#F660AB)); padding: 12px; font-weight: bold; text-align: center "><font color="white" size="6" >Prototype</font></div>=
 
=<div style="background: #FF0080; background: -webkit-gradient(linear, left top, left bottom, from(#FF0080), to(#F660AB)); padding: 12px; font-weight: bold; text-align: center "><font color="white" size="6" >Prototype</font></div>=
[[Image:6-bit_UI_1.png|Left|550px]]
+
==About Chapalang.com==
<br>
+
[[Image:6-bit_UI_11.png|center|650px]]
[[Image:6-bit_UI_2.png|Left|550px]]
+
==Login Page==
<br>
+
[[Image:6-bit_UI_1.png|center|650px]]
[[Image:6-bit_UI_3.png|Left|550px]]
+
==Marketplace Front Page==
<br>
+
[[Image:6-bit_UI_2.png|center|650px]]
[[Image:6-bit_UI_4.png|Left|550px]]
+
==Payment Process==
<br>
+
[[Image:6-bit_UI_3.png|center|650px]]
[[Image:6-bit_UI_5.png|Left|550px]]
+
==Profile Page==
<br>
+
[[Image:6-bit_UI_4.png|center|650px]]
[[Image:6-bit_UI_6.png|Left|550px]]
+
==Manage Product==
<br>
+
[[Image:6-bit_UI_5.png|center|650px]]
[[Image:6-bit_UI_7.png|Left|550px]]
+
==Manage Order==
 +
[[Image:6-bit_UI_6.png|center|650px]]
 +
==Manage Sale==
 +
[[Image:6-bit_UI_15.png|center|650px]]
 +
==Giftsharing==
 +
[[Image:6-bit_UI_7.png|center|650px]]
 
<br>
 
<br>
[[Image:6-bit_UI_8.png|Left|550px]]
+
[[Image:6-bit_UI_8.png|center|650px]]
 +
==Invite Friends==
 +
[[Image:6-bit_UI_9.png|center|650px]]
 +
==Top Bar==
 +
[[Image:6-bit_UI_10.png|center|650px]]
 +
==Mass Order==
 +
[[Image:6-bit_UI_14.png|center|650px]]
 
<br>
 
<br>
[[Image:6-bit_UI_9.png|Left|550px]]
+
[[Image:6-bit_UI_12.png|center|650px]]

Latest revision as of 21:50, 3 December 2012

6-bit logo.png
6-bit's Chapalang! is a social utility that connects people with friends and new friends
by offering a place for exchanging ideas and information on its public domain.
http://www.chapalang.com

Final Wikipage
Home Technical Overview Project Deliverables Project Management Learning Outcomes
Technical Diagrams User Interface Prototype Business Intelligence and Analytics



Prototype

About Chapalang.com

6-bit UI 11.png

Login Page

6-bit UI 1.png

Marketplace Front Page

6-bit UI 2.png

Payment Process

6-bit UI 3.png

Profile Page

6-bit UI 4.png

Manage Product

6-bit UI 5.png

Manage Order

6-bit UI 6.png

Manage Sale

6-bit UI 15.png

Giftsharing

6-bit UI 7.png


6-bit UI 8.png

Invite Friends

6-bit UI 9.png

Top Bar

6-bit UI 10.png

Mass Order

6-bit UI 14.png


6-bit UI 12.png