En Guide 3wdoc 5124y

Introduction to 3WDOC STUDIO (Beta)

   

 

Sheet n°1: INTRODUCTION 1/ Foreword - What is a track? A track is each element added in the sequence. Tracks can be medias (photos, audios, videos), articles and buttons.   Each track will be placed on time and space in the sequence.  

- What is a sequence? A sequence includes the edited work. It is composed of one or more tracks. Your story, or part of your story can be told in a sequence.    

- What is the Editor? The Editor is the workspace of each sequence.   You will build your story by selecting different tracks and editing them.    

- What is a WDOC?

A WDOC is the final story, composed of several sequences.     By analogy,      The WDOC is a book.    The sequence is a chapter.    The tracks are lines, photos, etc.        

2/ Think about the story   Think at the story you want to tell. It’s very important to make this work at the beginning, in order to create efficiently and optimize your time. Here are some recommendations:    

Prepare the script, write the main ideas. Build the overall structure of your WDOC. Build the structure of each sequence. A small sketch is always useful. Select and prepare the content that you will use: texts, medias, etc.

* You can read our tutorials and FAQ online at: http://3wdoc.com/en/api-3wdoc-tutorials and http://3wdoc.com/en/api-3wdoc-faq

- Introduction to 3WDOC STUDIO (Beta) -

2

   

 

Sheet n°2: PREPARATION OF MEDIA The media must have specific formats to be read by all platforms and browsers. Media Type Images Audios Videos (1)

Formats .jpg .png .gif (1) 960 x 540 px .mp3 .ogg The same file must be in two formats: mp3 and ogg. .mp4 .ogg The same file must be in two formats: mp4 and ogg. (1) 960 x 540 px

A good size to display your sequence in 16:9 full screen To display it in 4:3 full screen: 960 x 640 pixels

1/ ENCODING MEDIA: A - ENCODING AN AUDIO FILE: Audio files must be on .mp3. To create the .ogg, we recommend using "Firefogg", which is free and can be easily installed into the Firefox browser.

1. Select the mp3 file 2. In "Basic Quality and resolution control" >> "Audio quality": Move the cursor to 10. 3. Click « Encode to file » 4. The extension of your file is .ogv; change it to .ogg.

- Introduction to 3WDOC STUDIO (Beta) -

3

      B – ENCODING A VIDEO FILE: a. How to create a .mp4 with « MPEG Streamclip » : 1. Open your video file .mov in MPEG Streamclip 2. File > export to MPEG-4 3. Configure the following encoding parameters like in the image below:

4. Save your file .mp4 5. Please wait while encoding b. Create a .ogg file with "Firefogg": 1. Select your file in .mp4 format 2. Set the Preset:

3. Choose in "Basic Quality and resolution control" > "Video quality": Move the slider to 10. 4. Click on « Encode to file » 5. Please wait while encoding 6. The extension of your file is .ogv; change it to .ogg - Introduction to 3WDOC STUDIO (Beta) -

4

 

 

 

2/ MEDIA IN 3WDOC STUDIO: Click on MEDIA > CREATE > You are in « Media » dialog box: 1. Down in the window, choose the extension of the media 2. Click on « Launch »

3. The image displays 4. Close the dialog box

- Introduction to 3WDOC STUDIO (Beta) -

5

   

  5. 6. 7. 8.

Enter the "Label" (filename) Enter the Description and the name of the Author (optional fields) Click on the arrow to go to next page In "Tags": Enter the keywords that describes the media

3/ ORGANIZE THE MEDIA You can organize and edit your media from the "Media List" MEDIA > MANAGE

- Introduction to 3WDOC STUDIO (Beta) -

6

 

 

 

Sheet n°3: CREATING A SEQUENCE   Click on SEQUENCE > CREATE   > You are in the « Sequence Edit », the Setup window of the sequence. There are 3 fields filled by default:   1/ Width: 960 px (the width of the sequence in pixel; px is the abbreviation for pixels)   2/ Height: 640 px (the height of the sequence in pixel; px is the abbreviation for pixels)   3/ Autoplay: TRUE (the sequence launches automatically) Choose FALSE to create static pages, with no effect on the timeline (as for instance a Home page)     4/ Label: the name of the sequence (compulsory field) 5/ You can also fill these fields: Description, Tags

  To display it in 4:3 full screen on the browser, we recommend you to enter the following parameters:   - Width: 960 px   - Height: 640 px   - Native Window: False   - Ratio Window: 0  

  To display it in 16:9 full screen on the browser, we recommend you to enter the following parameters:   - Width: 960 px   - Height: 540 px   - Native Window: False   - Ratio Window: 0  

- Introduction to 3WDOC STUDIO (Beta) -

7

 

 

 

Sheet n°4: THE EDITOR   The 3WDOC EDITOR will allow you to build the story of each sequence. To access the Editor of a previously created sequence, click on SEQUENCE > MANAGE You are in the Sequence List > Click on the icon 3WDOC Editor

There are 3 main windows:   1/ Positioner: to place the tracks in space    You can move each track using the mouse.    You can also change the size of each track.    You can decide which tracks will be visible thanks to the check-box in the Timeline.     2/ Inspector: to edit the settings for each track    Information    Properties    Effects    Actions    Style     3/ Timeline: to place the tracks on time    You can change the length of the track (duration) using the mouse.    You can move the track on time using the mouse.    

- Introduction to 3WDOC STUDIO (Beta) -

8

   

 

3WDOC EDITOR:

 

        You can customize your workspace with DASHBOARD button. By clicking on it, you will unlock it and will be able to move the windows to your convenience.

- Introduction to 3WDOC STUDIO (Beta) -

9

 

 

 

Sheet n°5: THE STYLE 1/ CREATE A STYLE Click on STYLE > CREATE > you are in the Editor for the created Style. You create a style for a sequence. This style has a general style, 5 styles of article, 5 styles of button, and 5 styles of image. We let you discover the potential of the "Style Editor". It's actually a CSS and CSS3 editor. You can choose the color, the font, the size, the opacity, the borders, … and the effects on "hover" (change of style of an element on mouseover).

- Introduction to 3WDOC STUDIO (Beta) -

10

 

 

 

2/ CONFIGURATE THE PARAMETERS OF THE STYLE > Click on CONFIG icon

You are in the Style Edit window: 1. Enter the name of the Style 2. Enter the tags 3. You can also enter the Description and the name of the Author

- Introduction to 3WDOC STUDIO (Beta) -

11

 

 

 

3/ APPLY THE STYLE TO THE SEQUENCE In « Sequence Edit », select the Style to apply to the Sequence:

1. Select the style on the "Style List"

- Introduction to 3WDOC STUDIO (Beta) -

12

 

 

 

2. Apply the style to each track: To apply the Style to a track (a button, an image, an article), go to the Editor: Inspector > Style tab. Simply select the style of the item:

   

- Introduction to 3WDOC STUDIO (Beta) -

13

 

 

 

Sheet n°6: CREATING A WDOC The WDOC allows you to link the sequences between them.

1/ CREATE A WDOC Click on WDOC> CREATE: You are in the area where you can configure the WDOC.

4. Close the dialog box.

- Introduction to 3WDOC STUDIO (Beta) -

14

   

 

2/ INTEGRATING SEQUENCES IN A WDOC 1. Open the "Sequence List" 2. Edit the selected sequence by clicking on this icon: 3. You are in the Sequence Configuration 4. Click on

to go to last screen

5. Click on « Select »:

6. Select the WDOC in which you want to integrate the sequence:

7. Repeat the same operation for each sequence. Then you can close the dialog boxes. - Introduction to 3WDOC STUDIO (Beta) -

15

 

 

 

Sheet n°7: PUBLISH A WDOC OR A SEQUENCE 1/ PUBLISH A SEQUENCE: In the Editor, click on « SAVE» and then on « PUBLISH »:

Once your sequence published, it is public on the web. However it is very easy to make it private, by clicking on "UNPUBLISH"

2/ PUBLISH A WDOC To publish a WDOC, go to « WDOC Edit»:

- Introduction to 3WDOC STUDIO (Beta) -

16

 

 

 

3/ MY STORIES Click on the Home button of the main Menu to go to “MY STORIES”.    

    You can find your published items and share them on social networks.

 

 

- Introduction to 3WDOC STUDIO (Beta) -

17