Show/Hide Details

Schedule

DEFINED

Designed to mirror the appearance of the mobile application.

EPIC

Jira Linky

Desktop - Change Schedule view per mockups

Jira Linky

Date picker Header

Jira Linky

Work Segment 

Jira Linky

Calendar Overview

Jira Linky

None

Current
Future

Work

9:00

9:30

10:30

Work Segment 1

Work Segment 2

Work Segment 3

(Break Segment Description)

11:00

11:40

12:15

Work Segment 4

Work Segment 5

Work Segment 6

Lunch Segment

1:30

2:10

2:50

Work Segment 7

Work Segment 8

Work Segment 9

(Break Segment Description)

3:20

4:00

4:30

Work Segment 10

Work Segment 11

Work Segment 12

9:03

9 AM

10 AM

11 AM

12 PM

1 PM

2 PM

3 PM

4 PM

5 PM

6 PM

7 PM

8 PM

9 PM

10 PM

11 PM

12 AM

Schedule - Restricted Date Range

Not DEFINED

Takes into account if clients have configured to limit the number of scheduled days that agents can view.

Multi-Day

9:03

9 AM

10 AM

11 AM

12 PM

1 PM

2 PM

3 PM

4 PM

5 PM

6 PM

7 PM

8 PM

9 PM

10 PM

11 PM

12 AM

Work

9:00

9:30

10:30

Work Segment 1

Work Segment 2

Work Segment 3

(Break Segment Description)

11:00

11:40

12:15

Work Segment 4

Work Segment 5

Work Segment 6

Lunch Segment

1:30

2:10

2:50

Work Segment 7

Work Segment 8

Work Segment 9

(Break Segment Description)

3:20

4:00

4:30

Work Segment 10

Work Segment 11

Work Segment 12

Single Day

March 25, 2017

Work

9:00

9:30

10:30

Work Segment 1

Work Segment 2

Work Segment 3

(Break Segment Description)

11:00

11:40

12:15

Work Segment 4

Work Segment 5

Work Segment 6

Lunch Segment

1:30

2:10

2:50

Work Segment 7

Work Segment 8

Work Segment 9

(Break Segment Description)

3:20

4:00

4:30

Work Segment 10

Work Segment 11

Work Segment 12

9:03

9 AM

10 AM

11 AM

12 PM

1 PM

2 PM

3 PM

4 PM

5 PM

6 PM

7 PM

8 PM

9 PM

10 PM

11 PM

12 AM

Schedule - Shift Selected

DEFINED

Jira Linky

Will be a bottom sheet. Reference for exact interaction and behavior:
https://material.angularjs.org/latest/demo/bottomSheet

9:03

9 AM

10 AM

11 AM

12 PM

1 PM

2 PM

3 PM

4 PM

5 PM

6 PM

7 PM

8 PM

9 PM

10 PM

11 PM

12 AM

Work

9:00

9:30

10:30

Work Segment 1

Work Segment 2

Work Segment 3

(Break Segment Description)

11:00

11:40

12:15

Work Segment 4

Work Segment 5

Work Segment 6

Lunch Segment

1:30

2:10

2:50

Work Segment 7

Work Segment 8

Work Segment 9

(Break Segment Description)

3:20

4:00

4:30

Work Segment 10

Work Segment 11

Work Segment 12

Shift

March 15, 2017

8 Hours · 9:00 AM - 5:00PM

Edit Shift

Start Time

End Time

Schedule Date Picker Expanded

DEFINED

Jira Linky
Use the datepicker element from angular material with no changes: https://material.angularjs.org/latest/demo/datepicker

This mockup is only meant to show placement and the addition of the dots, which represent shifts.

Work

9:00

9:30

10:30

Work Segment 1

Work Segment 2

Work Segment 3

(Break Segment Description)

11:00

11:40

12:15

Work Segment 4

Work Segment 5

Work Segment 6

Lunch Segment

1:30

2:10

2:50

Work Segment 7

Work Segment 8

Work Segment 9

(Break Segment Description)

3:20

4:00

4:30

Work Segment 10

Work Segment 11

Work Segment 12

12 AM

1 AM

2 AM

3 AM

4 AM

5 AM

6 AM

7 AM

8 AM

9 AM

10 AM

11 AM

12 PM

1 PM

2 PM

3 PM

4 PM

5 PM

6 PM

7 PM

8 PM

9 PM

10 PM

11 PM

12 AM

Shift Details

IN DESIGN
NOT SCOPED

This would add a view to show the details of shift, matching the experience of the agent mobile application. Not sure what functionality would be needed for the desktop, as the context for the user is different.

Nothing yet