Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
OpenFrameworks Essentials
OpenFrameworks Essentials

OpenFrameworks Essentials: Create stunning, interactive openFrameworks-based applications with this fast-paced guide

eBook
$9.99 $25.99
Paperback
$32.99
Subscription
Free Trial
Renews at $19.99p/m

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing
Table of content icon View table of contents Preview book icon Preview Book

OpenFrameworks Essentials

Chapter 2. Creating Your First openFrameworks Project

In the previous chapter, we installed openFrameworks and learned how to build and run its example projects. It's time to start our own project! So, in this chapter, we are going to develop a sketch of the video synthesizer and explore the basics of 2D graphics with openFrameworks.

We will cover the following topics:

  • Creating a new project with Project Generator
  • openFrameworks project's structure
  • Setting up screen size and frame rate
  • Drawing geometric primitives, such as lines, triangles, and circles
  • Drawing patterns from geometric primitives

Creating and running a new project

Let's create a new openFrameworks project. The simplest way to do this is to use the Project Generator wizard included in openFrameworks for OS X, Windows, Linux, and iOS.

Note

Another way to create a new project is to copy any openFrameworks example to the apps/myApps folder (or any other subfolder of the apps folder) and use it from scratch for your project. The first thing you would need to do after copying is rename the project; please see the documentation of your IDE for details on how to do this.

Creating a project

To create a project, follow these steps:

  1. Run Project Generator : Open the ProjectGenerator_osx folder (in OS X), ProjectGenerator (in Windows), or apps/projectGenerator (in Linux) and run the executable named projectGenerator.

    Tip

    In Linux, Project Generator needs to be built before running; see the details on building a project in the Running your first example section of Chapter 1, Getting Started with openFrameworks.

    You will see the...

Discovering the project's code structure

Open the project's VideoSynth folder and find the src folder there. It contains the project's source code files, as shown in the following screenshot:

Discovering the project's code structure

The project's folder contents (the center column) and its source code files placed in the src folder (the right column)

There are three source files:

  • main.cpp: This file contains the code to initiate a window and run the app. We will leave it unchanged.
  • ofApp.h: This file is a declaration of the ofApp application class, which consists of a declaration of the functions, such as setup(), update(), draw(), and some others. Currently, we do not need to add anything there.
  • ofApp.cpp: This file contains definitions of declared functions. This is the file we will edit right now.

The following functions, declared in the ofApp class, are called by the openFrameworks engine:

  • setup(): This function is called once at the beginning of the application execution. This is the place to implement a project...

Setting up the screen

The very first thing to code is to set up the global attributes: the project's window title, screen size, rendering frame rate, and background color. To achieve this, add the following lines to the ofApp::setup() function's body in the ofApp.cpp file:

ofSetWindowTitle( "Video synth" );
ofSetWindowShape( 1280, 720 );
ofSetFrameRate( 60 );
ofBackground( ofColor::white );

Tip

Downloading the example code

You can download the example code files from your account at http://www.packtpub.com for all the Packt Publishing books you have purchased. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.

This code consists of calling four openFrameworks functions, which set the window title to Video synth, the project's drawing area size with width of 1280 pixels and height of 720 pixels, the frame rate to 60 Hz, and the white background, respectively.

Note

All openFrameworks...

Centering the coordinate system

By default, in openFrameworks (and in most computer programs dealing with 2D graphics), the center of the screen coordinate system is placed in the top-left corner of the screen. The horizontal axis is directed to the right and the vertical axis is directed downwards. The measurement unit is the pixel.

For a screen with size 1280 × 720 pixels, the top-left corner has the coordinates (0, 0) and the bottom-right corner has the coordinates (1280-1, 720-1) = (1279, 719), as shown in the following screenshot:

Centering the coordinate system

This shows the default coordinate system

We are planning to implement generative graphics, which is situated around the screen center. To make the code easier, it's a good approach to move the coordinate system origin to the screen center by adding the following lines to the ofApp::draw() function:

ofPushMatrix();
ofTranslate( ofGetWidth() / 2, ofGetHeight() / 2 );
//----
//...       We will place our drawing code here
//----
ofPopMatrix();

The ofPushMatrix...

A simple drawing

The simplest thing that can be drawn with openFrameworks is a geometric primitive such as a line, rectangle, or circle. Before drawing, we should set the drawing color using the ofSetColor function and then draw primitives using commands such as ofLine, ofRect, ofTriangle, and ofCircle (they draw a line, rectangle, triangle, and circle respectively). Let's consider setting the color and then drawing functions in detail.

Setting drawing color

The ofSetColor function switches the drawing color to a specified color. There are several overloaded versions of this function:

  • The most universal form lets us explicitly specify the red, green, blue, and alpha (opaqueness) components of the color:
    ofSetColor( 255, 0, 0, 255 );

    The arguments are integers from 0 to 255, which correspond to red, green, or blue color components and alpha color components. In our example, we will get the red opaque color because the red component is maximal, the blue and green components are zero, and...

Geometric patterns

The idea of creating a picture by repeatedly drawing several geometric primitives and shifting, rotating, or resizing them in small amounts is known from ancient times. The resultant picture is called a geometric pattern.

Tip

Ethnic ornaments are exciting examples of geometric patterns. Check Google's image search results on the geometric pattern and ethnic ornament to boost your creativity on the topic.

Creating geometric patterns with a computer is super easy, and it's a must-have feature of any video synthesizer. In the rest of the chapter, we will implement a simple but powerful pattern's type in detail, which we call a stripe pattern.

The stripe pattern

A stripe pattern is formed by drawing the geometric primitives repeatedly, placing their centers along some (invisible) curve, such as a straight line, a curved line, or even a spiral. We will call this curve a base curve.

Tip

The reason of naming is that the resultant figure sometimes resembles a stripe.

A...

Summary

In this chapter, we created a new project and set up its screen size and frame rate. Also, you learned the basics of 2D graphics with openFrameworks by drawing geometric primitives and stripe patterns.

The project we built is a sketch of the video synthesizer. In the next chapter, we will enhance it by adding GUI, which lets us change drawing parameters interactively.

Left arrow icon Right arrow icon

Description

If you are a programmer, visual artist, or designer with experience in creative coding, and want to use openFrameworks to create fun, stunning, and interactive applications, this is the book for you. Basic knowledge of programming languages, such as C++, Java, Python, or JavaScript, will be enough to proceed with the book.

What you will learn

  • Install openFrameworks and create a new project Generate 2D and 3D graphics Mix images and videos and process them with shaders Add GUI controls and adjust them from external devices and apps using the OSC protocol Control parameters with a timer, Perlin noise, and sound and text files Use the Arduino to control your application Build a video synthesizer project Run your project on iOS, Android, and Raspberry Pi devices

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Apr 23, 2015
Length: 206 pages
Edition : 1st
Language : English
ISBN-13 : 9781784396145
Category :

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing

Product Details

Publication date : Apr 23, 2015
Length: 206 pages
Edition : 1st
Language : English
ISBN-13 : 9781784396145
Category :

Packt Subscriptions

See our plans and pricing
Modal Close icon
$19.99 billed monthly
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Simple pricing, no contract
$199.99 billed annually
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just $5 each
Feature tick icon Exclusive print discounts
$279.99 billed in 18 months
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just $5 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total $ 136.97
Learning Three.js: The JavaScript 3D Library for WebGL - Second Edition
$54.99
OpenFrameworks Essentials
$32.99
Mastering openFrameworks: Creative Coding Demystified
$48.99
Total $ 136.97 Stars icon
Banner background image

Table of Contents

12 Chapters
1. Getting Started with openFrameworks Chevron down icon Chevron up icon
2. Creating Your First openFrameworks Project Chevron down icon Chevron up icon
3. Adding a GUI and Handling Keyboard Events Chevron down icon Chevron up icon
4. Working with Raster Graphics – Images, Videos, and Shaders Chevron down icon Chevron up icon
5. Creating 3D Graphics Chevron down icon Chevron up icon
6. Animating Parameters Chevron down icon Chevron up icon
7. Distributed and Physical Computing with Networking and Arduino Chevron down icon Chevron up icon
8. Deploying the Project on iOS, Android, and Raspberry Pi Chevron down icon Chevron up icon
9. Further Resources Chevron down icon Chevron up icon
A. Video Synthesizer Reference Chevron down icon Chevron up icon
B. openFrameworks Quick Reference Chevron down icon Chevron up icon
Index Chevron down icon Chevron up icon

Customer reviews

Top Reviews
Rating distribution
Full star icon Full star icon Full star icon Full star icon Half star icon 4.6
(8 Ratings)
5 star 87.5%
4 star 0%
3 star 0%
2 star 12.5%
1 star 0%
Filter icon Filter
Top Reviews

Filter reviews by




Amazon Customer Aug 30, 2021
Full star icon Full star icon Full star icon Full star icon Full star icon 5
I am not a programmer, though I have a bit of basic programming experience. This book is clear enough so that I can understand it and I can try out all the examples and use them as a basis for my own experiments.
Amazon Verified review Amazon
Yoichi Nagashima Jun 03, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
At first, I again strongly recommend to read the first book of the author "openFrameworks Essentials" for people who want to expand the possibility in designing interactive multimedia. I enjoyed that first book as my first experience about the openFrameworks. And I understood that openFrameworks can realize the same great projects like Max/MSP/jitter or Processing, but the final application is "standard", not as special environments : this is the open source culture, of course.This second book is presented by the author and a video artist. The author Denis Perevalov is a enthusiastic and sincere scientist, and he has collaborated with many artists in many projects. If you search his name in YouTube or in Vineo, you will enjoy many amazing interactive multimedia projects. Though I had thought that the title of this book "Essentials" means the advanced level from the first book, I understand this more thin book is rather practical version for students. The first book is a textbook, and this second book is the manual to develop an exciting "Video Synthesizer" for amazing VJ performance.In Processing website, Arduino website and Raspberry Pi website, there are standard "Tutorial" page for beginners. We are overwhelmed by the texts introducing many knowledges in an orderly manner, and fear that we cannot do anything before we do not master all of them. This is a problem of "text book" generally. On the contrary, this new book presents the "Video Synthesizer Structure" at the beginning. We can overview of the whole project constructed by each modules of openFrameworks, and we can study/test/arrange any part of them in response to our own request.The traditional education in design was "learn, then produce". But 21st-century design education is "producing with study", because we can get huge knowledges/know-hows by Internet and the system works realtime. This culture "Sketching" (Sketching in Hardware) expands by the open source culture in the world. We can be happy all by the open source culture and Internet - this book informs us the happy future in design, I think. I want to recommend with confidence this book to my students and research/design/education communities.
Amazon Verified review Amazon
Cameren Aug 30, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Step by step instructions to create a video synthesizer work really well. Great introduction into openFrameworks.
Amazon Verified review Amazon
Dolores Joya May 13, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
This book covers a build up of project work which is closer to a real application of the knowledge. Denis covers a lot of the more sought after techniques in this book. I've read Denis Perevalov's first book Mastering openFramewoks: Creative Coding Demystified and was quickly on my feet with OpenFrameworks. I did a little research and discovered he has taught this subject for several years and his teaching style comes through. I would read openFrameworks Essentials to get the feel of building a full project and read Mastering OpenFrameworks for a walk-thru or reference for what OpenFrameworks can do.
Amazon Verified review Amazon
cloud_canvas Aug 08, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
I cannot praise this book highly enough. The project you build looks awesome, and the extent they take you to with adding all kinds of common hooks into it (LFOs for modulation, OSC hooks, reading serial values from a microcontroller) are incredibly useful for every type of creative coding project... these are things that I need to do all the time.Make sure to save a zip of your project at the end of Chapter 3 like they tell you to do. Even though it only comprises about 40 pages towards the end of the book, there's a final sprint of executing a diminutive version of the final project on literally every single platform that oF can handle that's exhilarating!This book covers everything it should in the best way possible with the most satisfying result. I am VERY impressed, and I can't wait to tie into the authors' other openFrameworks book.
Amazon Verified review Amazon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

What is included in a Packt subscription? Chevron down icon Chevron up icon

A subscription provides you with full access to view all Packt and licnesed content online, this includes exclusive access to Early Access titles. Depending on the tier chosen you can also earn credits and discounts to use for owning content

How can I cancel my subscription? Chevron down icon Chevron up icon

To cancel your subscription with us simply go to the account page - found in the top right of the page or at https://subscription.packtpub.com/my-account/subscription - From here you will see the ‘cancel subscription’ button in the grey box with your subscription information in.

What are credits? Chevron down icon Chevron up icon

Credits can be earned from reading 40 section of any title within the payment cycle - a month starting from the day of subscription payment. You also earn a Credit every month if you subscribe to our annual or 18 month plans. Credits can be used to buy books DRM free, the same way that you would pay for a book. Your credits can be found in the subscription homepage - subscription.packtpub.com - clicking on ‘the my’ library dropdown and selecting ‘credits’.

What happens if an Early Access Course is cancelled? Chevron down icon Chevron up icon

Projects are rarely cancelled, but sometimes it's unavoidable. If an Early Access course is cancelled or excessively delayed, you can exchange your purchase for another course. For further details, please contact us here.

Where can I send feedback about an Early Access title? Chevron down icon Chevron up icon

If you have any feedback about the product you're reading, or Early Access in general, then please fill out a contact form here and we'll make sure the feedback gets to the right team. 

Can I download the code files for Early Access titles? Chevron down icon Chevron up icon

We try to ensure that all books in Early Access have code available to use, download, and fork on GitHub. This helps us be more agile in the development of the book, and helps keep the often changing code base of new versions and new technologies as up to date as possible. Unfortunately, however, there will be rare cases when it is not possible for us to have downloadable code samples available until publication.

When we publish the book, the code files will also be available to download from the Packt website.

How accurate is the publication date? Chevron down icon Chevron up icon

The publication date is as accurate as we can be at any point in the project. Unfortunately, delays can happen. Often those delays are out of our control, such as changes to the technology code base or delays in the tech release. We do our best to give you an accurate estimate of the publication date at any given time, and as more chapters are delivered, the more accurate the delivery date will become.

How will I know when new chapters are ready? Chevron down icon Chevron up icon

We'll let you know every time there has been an update to a course that you've bought in Early Access. You'll get an email to let you know there has been a new chapter, or a change to a previous chapter. The new chapters are automatically added to your account, so you can also check back there any time you're ready and download or read them online.

I am a Packt subscriber, do I get Early Access? Chevron down icon Chevron up icon

Yes, all Early Access content is fully available through your subscription. You will need to have a paid for or active trial subscription in order to access all titles.

How is Early Access delivered? Chevron down icon Chevron up icon

Early Access is currently only available as a PDF or through our online reader. As we make changes or add new chapters, the files in your Packt account will be updated so you can download them again or view them online immediately.

How do I buy Early Access content? Chevron down icon Chevron up icon

Early Access is a way of us getting our content to you quicker, but the method of buying the Early Access course is still the same. Just find the course you want to buy, go through the check-out steps, and you’ll get a confirmation email from us with information and a link to the relevant Early Access courses.

What is Early Access? Chevron down icon Chevron up icon

Keeping up to date with the latest technology is difficult; new versions, new frameworks, new techniques. This feature gives you a head-start to our content, as it's being created. With Early Access you'll receive each chapter as it's written, and get regular updates throughout the product's development, as well as the final course as soon as it's ready.We created Early Access as a means of giving you the information you need, as soon as it's available. As we go through the process of developing a course, 99% of it can be ready but we can't publish until that last 1% falls in to place. Early Access helps to unlock the potential of our content early, to help you start your learning when you need it most. You not only get access to every chapter as it's delivered, edited, and updated, but you'll also get the finalized, DRM-free product to download in any format you want when it's published. As a member of Packt, you'll also be eligible for our exclusive offers, including a free course every day, and discounts on new and popular titles.