WordPress 3.5 Media Wireframes

by Daryl Koopersmith

Slide 1

Slide 1 text

Media Wireframes WordPress 3.5

Slide 2

Slide 2 text

Upload/Insert

Slide 3

Slide 3 text

Upload/Insert CLICK

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Select Files Drop files here or Insert Media Select one or more media files: Sort by upload date  Show all file types  Search IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... FIXED SCROLL INFINITE SCROLL Page Structure

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Select Files Drop files here or Insert Media Select one or more media files: Sort by upload date  Show all file types  Search Create a new gallery Add to gallery 2 images selected IMAGE IMAGE IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... Insert IMAGE Describe this image... Insert clear selection IMAGE Describe this image... CLICK

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Slide 21

Slide 21 text

Select Files Drop files here or Insert Media Select one or more media files: Sort by upload date  Show all file types  Search Create a new gallery Add to gallery 3 images selected IMAGE IMAGE IMAGE IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... Insert IMAGE Describe this image... Insert IMAGE Describe this image... Insert clear selection IMAGE Describe this image... IMAGE Describe this image... IMAGE IMAGE IMAGE Uploading... Describe this image... Insert Describe this image... Insert Describe this image... Insert

Slide 22

Slide 22 text

Select Files Drop files here or Insert Media Select one or more media files: Sort by upload date  Show all file types  Search Create a new gallery Add to gallery 3 images selected IMAGE IMAGE IMAGE IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... Insert IMAGE Describe this image... Insert IMAGE Describe this image... Insert clear selection IMAGE Describe this image... IMAGE Describe this image... IMAGE IMAGE IMAGE Uploading... Global progress bar. Describe this image... Insert Describe this image... Insert Describe this image... Insert

Slide 23

Slide 23 text

Select Files Drop files here or Insert Media Select one or more media files: Sort by upload date  Show all file types  Search Create a new gallery Add to gallery 3 images selected IMAGE IMAGE IMAGE IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... Insert IMAGE Describe this image... Insert IMAGE Describe this image... Insert clear selection IMAGE Describe this image... IMAGE Describe this image... IMAGE IMAGE IMAGE Uploading... Global progress bar. Describe this image... Insert Describe this image... Insert Describe this image... Insert Uploaded files are automatically selected.

Slide 24

Slide 24 text

Insert into post.

Slide 25

Slide 25 text

Upload/Insert

Slide 26

Slide 26 text

Upload/Insert CLICK

Slide 27

Slide 27 text

Slide 28

Slide 28 text

Slide 29

Slide 29 text

Slide 30

Slide 30 text

Insert into post Insert Media Describe this image... Caption Alt Text None Media File Attachment Page Link To Display Properties None Left Center Right Alignment Small – (150 × 90)   Size IMAGE Edit Image DSC_2910.png image/png Uploaded July 23, 2012 512 × 234 Return to Media Library

Slide 31

Slide 31 text

Slide 32

Slide 32 text

IMAGE Edit × Upload/Insert

Slide 33

Slide 33 text

Edit an image.

Slide 34

Slide 34 text

IMAGE Upload/Insert

Slide 35

Slide 35 text

IMAGE Edit × Upload/Insert HOVER

Slide 36

Slide 36 text

IMAGE Edit × Upload/Insert CLICK

Slide 37

Slide 37 text

Save changes Edit Media IMAGE Edit Image DSC_2910.png image/png Uploaded July 23, 2012 512 × 234 Describe this image... Caption Alt Text None Media File Attachment Page Link To Display Properties None Left Center Right Alignment Small – (150 × 90)   Size

Slide 38

Slide 38 text

Slide 39

Slide 39 text

Slide 40

Slide 40 text

Upload/Insert IMAGE

Slide 41

Slide 41 text

Upload an image.

Slide 42

Slide 42 text

Upload/Insert

Slide 43

Slide 43 text

Upload/Insert ﬁle.png DRAG

Slide 44

Slide 44 text

IMAGE Edit × Upload/Insert Image is inserted with the previously used properties and automatically selected for easy editing. Edit ×

Slide 45

Slide 45 text

IMAGE Edit × Upload/Insert

Slide 46

Slide 46 text

Create a gallery.

Slide 47

Slide 47 text

Upload/Insert

Slide 48

Slide 48 text

Upload/Insert CLICK

Slide 49

Slide 49 text

Slide 50

Slide 50 text

Slide 51

Slide 51 text

Slide 52

Slide 52 text

Slide 53

Slide 53 text

Select Files Drop files here or Insert Media Select one or more media files: Sort by upload date  Show all file types  Search Create a new gallery Add to gallery 4 images selected IMAGE IMAGE IMAGE clear selection IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... Insert IMAGE Describe this image... Insert IMAGE Describe this image... Insert IMAGE Describe this image... Insert CLICK

Slide 54

Slide 54 text

Slide 55

Slide 55 text

Select Files Drop ﬁles here or Insert Gallery 3  Columns None Media File Attachment Page Link To Gallery display properties: Arrange and caption your images: Arrange by custom  IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... Insert gallery into post Add images from media library Return to media library

Slide 56

Slide 56 text

Slide 57

Slide 57 text

Slide 58

Slide 58 text

Slide 59

Slide 59 text

Slide 60

Slide 60 text

Slide 61

Slide 61 text

Slide 62

Slide 62 text

GALLERY Edit × Upload/Insert

Slide 63

Slide 63 text

Edit a gallery.

Slide 64

Slide 64 text

GALLERY Upload/Insert

Slide 65

Slide 65 text

GALLERY Edit × Upload/Insert HOVER

Slide 66

Slide 66 text

GALLERY Edit × Upload/Insert CLICK

Slide 67

Slide 67 text

Select Files Drop ﬁles here or Insert Gallery Save gallery Add images from media library 3  Columns None Media File Attachment Page Link To Gallery display properties: Arrange and caption your images: Arrange by custom  IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image... IMAGE Describe this image...

Slide 68

Slide 68 text

Slide 69

Slide 69 text

GALLERY Edit × Upload/Insert

Slide 70

Slide 70 text

Choose a custom header.

Slide 71

Slide 71 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Choose a Custom Header

Slide 72

Slide 72 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Choose a Custom Header HOVER

Slide 73

Slide 73 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Choose a Custom Header CLICK

Slide 74

Slide 74 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Choose a Custom Header CLICK Selecting an image advances to the next screen.

Slide 75

Slide 75 text

Crop header image Choose a Custom Header Return to Media Library IMAGE Crop 1000 × 288 Use header image as is Images should be at least 1000 pixels wide. Suggested dimensions: 1000px × 288px

Slide 76

Slide 76 text

Crop header image Choose a Custom Header Return to Media Library IMAGE Crop 1000 × 288 Use header image as is Images should be at least 1000 pixels wide. Suggested dimensions: 1000px × 288px CLICK

Slide 77

Slide 77 text

Select a featured image.

Slide 78

Slide 78 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Select a Featured Image

Slide 79

Slide 79 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Select a Featured Image HOVER

Slide 80

Slide 80 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Select a Featured Image CLICK

Slide 81

Slide 81 text

Select a File Drop a ﬁle here or Select an image: Sort by upload date  Search IMAGE IMAGE IMAGE IMAGE IMAGE IMAGE Select a Featured Image CLICK Selecting an image closes the modal.