SlideShare a Scribd company logo
1 of 5
Download to read offline
Mock MTA.info Homepage: S.T.A.R. Analysis
Concept & Design by Charles A. Walsh
Tools: Sketch 3, Pen & Paper
S.T.A.R. Analysis: Mock MTA Homepage
MTA.info needed a new homepage. The homepage had
an outdated design, too many links, and little information
structure.
To find out what visitors use most and deliver increased
usability, accessibility, and the overall user experience of
the overall homepage.
Situation:
Task:
S.T.A.R. Analysis: Mock MTA Homepage
I held a Q&A with 100 imaginary MTA.info users about
which features they used most frequently. The
consensus:
1. Trip Planner
2. Service Status
3. Future plans section
4. tourism
5. App Center
Action:
The Q&A results allowed to begin the information design and sketch
process.
1. Information Design
I placed each link on the homepage in categories: Blog, Future
Projects, Apps, etc. Then, ordered them by importance according to
the Q&A results. The categories mentioned in the would be featured
in the body of the homepage. Everything else would be placed in
the Directory footer. The header menu was simplified and ordered-
based on user value from the Q&A, including a language option. To
accommodate for the new fictional MTA App, I placed a “Buy a
Card” option for online payments in the menu to increase MTA
revenue.
Wireframes
Information Grouping
S.T.A.R. Analysis: Mock MTA Homepage
3. Interactive Design
All widgets labeled with a “+” on the homepage are retractable. This
creates better flow and fixes the link clutter found on the original
website.
2. Visual Design
The homepage follows a Z-Pattern. Widgets are placed on the page
according to user importance. I then redesigned the Trip Planner. I
kept the important options--transportation mode, To & From, Time,
and extra options--creating a more user-friendly widget.
S.T.A.R. Analysis: Mock MTA Homepage
Result: By organizing the MTA homepage according to the
highest User Value, The new homepage allows users to navigate
faster, make quick online payments, and is overall more visually
appealing.
By organizing the MTA homepage according to my
user research, The new model allows faster
navigation, quick online payments, and is visually
appealing, improving the overall UX of the MTA.info
homepage.
Result:

More Related Content

Viewers also liked

Viewers also liked (14)

L'eau.doc
L'eau.docL'eau.doc
L'eau.doc
 
G muir a4virtualresume
G muir a4virtualresumeG muir a4virtualresume
G muir a4virtualresume
 
Past continuous
Past continuousPast continuous
Past continuous
 
AllInSports
AllInSportsAllInSports
AllInSports
 
Randy oktrima putra
Randy oktrima putraRandy oktrima putra
Randy oktrima putra
 
Phyf105 tutorial questions s3y0809ed
Phyf105 tutorial questions s3y0809edPhyf105 tutorial questions s3y0809ed
Phyf105 tutorial questions s3y0809ed
 
Taklimat physics
Taklimat physicsTaklimat physics
Taklimat physics
 
Inked Magazine
Inked MagazineInked Magazine
Inked Magazine
 
Semantic Exchange, a history
Semantic Exchange, a historySemantic Exchange, a history
Semantic Exchange, a history
 
RISO AFRICA CORPORATE PRESENTATION PCA
RISO AFRICA CORPORATE PRESENTATION PCARISO AFRICA CORPORATE PRESENTATION PCA
RISO AFRICA CORPORATE PRESENTATION PCA
 
Godknows K Chiodza cv
Godknows K Chiodza cvGodknows K Chiodza cv
Godknows K Chiodza cv
 
What is a learning organization?
What is a learning organization?What is a learning organization?
What is a learning organization?
 
Pentru Dani
Pentru DaniPentru Dani
Pentru Dani
 
nstitucionální prostředí jako předmět hodnocení vědy, vývoje a inovací z gend...
nstitucionální prostředí jako předmět hodnocení vědy, vývoje a inovací z gend...nstitucionální prostředí jako předmět hodnocení vědy, vývoje a inovací z gend...
nstitucionální prostředí jako předmět hodnocení vědy, vývoje a inovací z gend...
 

Similar to MTA.Info Homepage Mockup

Lambeth Council's Website Redesign
Lambeth Council's Website RedesignLambeth Council's Website Redesign
Lambeth Council's Website RedesignSusanna Willis
 
Usability review
Usability reviewUsability review
Usability reviewsayedshiban
 
Web Design Solutions
Web Design Solutions Web Design Solutions
Web Design Solutions APARNA SANAKA
 
Web aggregation and mashup with kapow mashup server
Web aggregation and mashup with kapow mashup serverWeb aggregation and mashup with kapow mashup server
Web aggregation and mashup with kapow mashup serverYudep Apoi
 
Office Interior Design Websites..........
Office Interior Design Websites..........Office Interior Design Websites..........
Office Interior Design Websites..........siriajadhav16
 
OFFICE INTERIOR DESIGN WEBSITES
OFFICE INTERIOR DESIGN WEBSITESOFFICE INTERIOR DESIGN WEBSITES
OFFICE INTERIOR DESIGN WEBSITESsirriajadhav001
 
Office Interior Design Websites
Office Interior Design WebsitesOffice Interior Design Websites
Office Interior Design Websitessirriajadhav001
 
Data Driven Design: Using Web Analytics to Improve Information Architectures
Data Driven Design: Using Web Analytics to Improve Information ArchitecturesData Driven Design: Using Web Analytics to Improve Information Architectures
Data Driven Design: Using Web Analytics to Improve Information ArchitecturesAndrea Wiggins
 
SoTM US Routing
SoTM US RoutingSoTM US Routing
SoTM US RoutingMapQuest
 
Putting the "User" back in User Experience
Putting the "User" back in User ExperiencePutting the "User" back in User Experience
Putting the "User" back in User ExperienceJeremy Johnson
 

Similar to MTA.Info Homepage Mockup (20)

Lambeth Council's Website Redesign
Lambeth Council's Website RedesignLambeth Council's Website Redesign
Lambeth Council's Website Redesign
 
Usability review
Usability reviewUsability review
Usability review
 
517 final report
517 final report517 final report
517 final report
 
Intranet Content Migration
Intranet Content MigrationIntranet Content Migration
Intranet Content Migration
 
Usability
UsabilityUsability
Usability
 
IA workshop
IA workshopIA workshop
IA workshop
 
OneBusAway User Research
OneBusAway User ResearchOneBusAway User Research
OneBusAway User Research
 
Web Design Solutions
Web Design Solutions Web Design Solutions
Web Design Solutions
 
Web aggregation and mashup with kapow mashup server
Web aggregation and mashup with kapow mashup serverWeb aggregation and mashup with kapow mashup server
Web aggregation and mashup with kapow mashup server
 
Website development
Website developmentWebsite development
Website development
 
Website development
Website developmentWebsite development
Website development
 
Slides chapter 19
Slides chapter 19Slides chapter 19
Slides chapter 19
 
Office Interior Design Websites..........
Office Interior Design Websites..........Office Interior Design Websites..........
Office Interior Design Websites..........
 
OFFICE INTERIOR DESIGN WEBSITES
OFFICE INTERIOR DESIGN WEBSITESOFFICE INTERIOR DESIGN WEBSITES
OFFICE INTERIOR DESIGN WEBSITES
 
Office Interior Design Websites
Office Interior Design WebsitesOffice Interior Design Websites
Office Interior Design Websites
 
REPORT
REPORTREPORT
REPORT
 
Research Paper
Research PaperResearch Paper
Research Paper
 
Data Driven Design: Using Web Analytics to Improve Information Architectures
Data Driven Design: Using Web Analytics to Improve Information ArchitecturesData Driven Design: Using Web Analytics to Improve Information Architectures
Data Driven Design: Using Web Analytics to Improve Information Architectures
 
SoTM US Routing
SoTM US RoutingSoTM US Routing
SoTM US Routing
 
Putting the "User" back in User Experience
Putting the "User" back in User ExperiencePutting the "User" back in User Experience
Putting the "User" back in User Experience
 

Recently uploaded

B.tech civil major project by Deepak Kumar
B.tech civil major project by Deepak KumarB.tech civil major project by Deepak Kumar
B.tech civil major project by Deepak KumarDeepak15CivilEngg
 
AGBE4223_Lab.Exercise-No.1-AY-2023-2024.docx
AGBE4223_Lab.Exercise-No.1-AY-2023-2024.docxAGBE4223_Lab.Exercise-No.1-AY-2023-2024.docx
AGBE4223_Lab.Exercise-No.1-AY-2023-2024.docxrdlsayritan
 
如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证gakamzu
 
Specialize in a MSc within Biomanufacturing, and work part-time as Process En...
Specialize in a MSc within Biomanufacturing, and work part-time as Process En...Specialize in a MSc within Biomanufacturing, and work part-time as Process En...
Specialize in a MSc within Biomanufacturing, and work part-time as Process En...Juli Boned
 
Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...
Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...
Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...anjli garg#k09
 
Biography of Doctor Arif Patel Preston UK
Biography of Doctor Arif Patel Preston UKBiography of Doctor Arif Patel Preston UK
Biography of Doctor Arif Patel Preston UKArifPatel42
 
LinkedIn For Job Search Presentation May 2024
LinkedIn For Job Search Presentation May 2024LinkedIn For Job Search Presentation May 2024
LinkedIn For Job Search Presentation May 2024Bruce Bennett
 
如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证gkyvm
 
Infant Guidance and Counselling and Life Skills Education syllabus.docx
Infant Guidance and Counselling  and Life Skills Education syllabus.docxInfant Guidance and Counselling  and Life Skills Education syllabus.docx
Infant Guidance and Counselling and Life Skills Education syllabus.docxGoldenKahwema
 
We’re looking for a junior patent engineer to join our Team!
We’re looking for a junior patent engineer to join our Team!We’re looking for a junior patent engineer to join our Team!
We’re looking for a junior patent engineer to join our Team!Juli Boned
 
Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...
Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...
Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...Juli Boned
 
b-sc-agri-course-curriculum.pdf for Karnataka state board
b-sc-agri-course-curriculum.pdf for Karnataka state boardb-sc-agri-course-curriculum.pdf for Karnataka state board
b-sc-agri-course-curriculum.pdf for Karnataka state boardramyaul734
 
如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证gkyvm
 
UXPA Boston 2024 Maximize the Client Consultant Relationship.pdf
UXPA Boston 2024 Maximize the Client Consultant Relationship.pdfUXPA Boston 2024 Maximize the Client Consultant Relationship.pdf
UXPA Boston 2024 Maximize the Client Consultant Relationship.pdfDan Berlin
 
B.tech Civil Engineering Major Project by Deepak Kumar ppt.pdf
B.tech Civil Engineering Major Project by Deepak Kumar ppt.pdfB.tech Civil Engineering Major Project by Deepak Kumar ppt.pdf
B.tech Civil Engineering Major Project by Deepak Kumar ppt.pdfDeepak15CivilEngg
 
如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样
如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样
如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样muwyto
 
NACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptx
NACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptxNACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptx
NACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptxShifanaFEBINP
 
如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证epyhpep
 
Sales Experience Presentation - Angel Lopez
Sales Experience Presentation - Angel LopezSales Experience Presentation - Angel Lopez
Sales Experience Presentation - Angel LopezInfinity Skies Corp
 

Recently uploaded (20)

B.tech civil major project by Deepak Kumar
B.tech civil major project by Deepak KumarB.tech civil major project by Deepak Kumar
B.tech civil major project by Deepak Kumar
 
AGBE4223_Lab.Exercise-No.1-AY-2023-2024.docx
AGBE4223_Lab.Exercise-No.1-AY-2023-2024.docxAGBE4223_Lab.Exercise-No.1-AY-2023-2024.docx
AGBE4223_Lab.Exercise-No.1-AY-2023-2024.docx
 
如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(NEU毕业证书)东北大学毕业证成绩单本科硕士学位证留信学历认证
 
Specialize in a MSc within Biomanufacturing, and work part-time as Process En...
Specialize in a MSc within Biomanufacturing, and work part-time as Process En...Specialize in a MSc within Biomanufacturing, and work part-time as Process En...
Specialize in a MSc within Biomanufacturing, and work part-time as Process En...
 
Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...
Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...
Mallu Aunts ℂall Girls Ahmedabad ℂall Us 6378878445 Top ℂlass ℂall Girl Servi...
 
Biography of Doctor Arif Patel Preston UK
Biography of Doctor Arif Patel Preston UKBiography of Doctor Arif Patel Preston UK
Biography of Doctor Arif Patel Preston UK
 
LinkedIn For Job Search Presentation May 2024
LinkedIn For Job Search Presentation May 2024LinkedIn For Job Search Presentation May 2024
LinkedIn For Job Search Presentation May 2024
 
如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(VIU毕业证书)温哥华岛大学毕业证成绩单本科硕士学位证留信学历认证
 
Infant Guidance and Counselling and Life Skills Education syllabus.docx
Infant Guidance and Counselling  and Life Skills Education syllabus.docxInfant Guidance and Counselling  and Life Skills Education syllabus.docx
Infant Guidance and Counselling and Life Skills Education syllabus.docx
 
We’re looking for a junior patent engineer to join our Team!
We’re looking for a junior patent engineer to join our Team!We’re looking for a junior patent engineer to join our Team!
We’re looking for a junior patent engineer to join our Team!
 
Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...
Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...
Novo Nordisk Kalundborg. We are expanding our manufacturing hub in Kalundborg...
 
b-sc-agri-course-curriculum.pdf for Karnataka state board
b-sc-agri-course-curriculum.pdf for Karnataka state boardb-sc-agri-course-curriculum.pdf for Karnataka state board
b-sc-agri-course-curriculum.pdf for Karnataka state board
 
如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(TMU毕业证书)多伦多都会大学毕业证成绩单本科硕士学位证留信学历认证
 
UXPA Boston 2024 Maximize the Client Consultant Relationship.pdf
UXPA Boston 2024 Maximize the Client Consultant Relationship.pdfUXPA Boston 2024 Maximize the Client Consultant Relationship.pdf
UXPA Boston 2024 Maximize the Client Consultant Relationship.pdf
 
B.tech Civil Engineering Major Project by Deepak Kumar ppt.pdf
B.tech Civil Engineering Major Project by Deepak Kumar ppt.pdfB.tech Civil Engineering Major Project by Deepak Kumar ppt.pdf
B.tech Civil Engineering Major Project by Deepak Kumar ppt.pdf
 
如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样
如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样
如何办理(CQU毕业证书)中央昆士兰大学毕业证成绩单原件一模一样
 
NACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptx
NACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptxNACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptx
NACO GUIDELINES IN TREATING HIV IN PREGNANCY.pptx
 
如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia毕业证书)哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
 
Sales Experience Presentation - Angel Lopez
Sales Experience Presentation - Angel LopezSales Experience Presentation - Angel Lopez
Sales Experience Presentation - Angel Lopez
 
Transferable Skills - Roadmaps & Resources - Dirk Spencer
Transferable Skills - Roadmaps & Resources - Dirk SpencerTransferable Skills - Roadmaps & Resources - Dirk Spencer
Transferable Skills - Roadmaps & Resources - Dirk Spencer
 

MTA.Info Homepage Mockup

  • 1. Mock MTA.info Homepage: S.T.A.R. Analysis Concept & Design by Charles A. Walsh Tools: Sketch 3, Pen & Paper
  • 2. S.T.A.R. Analysis: Mock MTA Homepage MTA.info needed a new homepage. The homepage had an outdated design, too many links, and little information structure. To find out what visitors use most and deliver increased usability, accessibility, and the overall user experience of the overall homepage. Situation: Task:
  • 3. S.T.A.R. Analysis: Mock MTA Homepage I held a Q&A with 100 imaginary MTA.info users about which features they used most frequently. The consensus: 1. Trip Planner 2. Service Status 3. Future plans section 4. tourism 5. App Center Action: The Q&A results allowed to begin the information design and sketch process. 1. Information Design I placed each link on the homepage in categories: Blog, Future Projects, Apps, etc. Then, ordered them by importance according to the Q&A results. The categories mentioned in the would be featured in the body of the homepage. Everything else would be placed in the Directory footer. The header menu was simplified and ordered- based on user value from the Q&A, including a language option. To accommodate for the new fictional MTA App, I placed a “Buy a Card” option for online payments in the menu to increase MTA revenue. Wireframes Information Grouping
  • 4. S.T.A.R. Analysis: Mock MTA Homepage 3. Interactive Design All widgets labeled with a “+” on the homepage are retractable. This creates better flow and fixes the link clutter found on the original website. 2. Visual Design The homepage follows a Z-Pattern. Widgets are placed on the page according to user importance. I then redesigned the Trip Planner. I kept the important options--transportation mode, To & From, Time, and extra options--creating a more user-friendly widget.
  • 5. S.T.A.R. Analysis: Mock MTA Homepage Result: By organizing the MTA homepage according to the highest User Value, The new homepage allows users to navigate faster, make quick online payments, and is overall more visually appealing. By organizing the MTA homepage according to my user research, The new model allows faster navigation, quick online payments, and is visually appealing, improving the overall UX of the MTA.info homepage. Result: