Forum Rule: Always post complete source code & details to reproduce any issue!
Results 1 to 13 of 13

Thread: dynamic backlight for picture frames "giraffe"

  1. #1
    Junior Member
    Join Date
    May 2018
    Posts
    6

    dynamic backlight for picture frames "giraffe"

    Hi,

    I am a professional photographer from Germany/Europe and I would like to enhance the deepness and vitality of my pictures by dynamically illuminate them with an addressable backlight. As an example please check the pictures of the giraffe attached. From the original picture a created a BMP file 24-bit with a resolution of 19x17 pixels. My idea is to transfer the color information of these pixels to the same position of the LED matrix to illuminate my picture with the color saturation of the original picture.

    The frame is 60x40cm and I have daisy chained 323 LEDs RGB, horizontally 17 rows, vertically 19 columns, LED pitch is 2cm. The soldering is left to right bottom up, starting lowest left corner. My programming skills are very limited, I am able to run the Arduino IDE and was able to install Teensy 3.2. but I lost track when it comes to

    a) convert the BMP file to machine readable RGB code (c++)
    b) create a sketch
    c) implementing the LED color information (a) to the sketch (b)

    Anybody willing to help me and contribute? I am also willing to financially compensate for the efforts,
    I am planning to use also different pictures sizes and amount of LEDs, therefore I am looking for a general solution
    which a can adapt myself for projects which will follow.

    Thanks
    Dominicgiraffe_indiziert_web.bmpgiraffe.bmpClick image for larger version. 

Name:	giraffe_3.jpg 
Views:	12 
Size:	160.9 KB 
ID:	15024Click image for larger version. 

Name:	giraffe_2.jpg 
Views:	11 
Size:	164.7 KB 
ID:	15025Click image for larger version. 

Name:	giraffe_1.jpg 
Views:	11 
Size:	120.2 KB 
ID:	15026

  2. #2
    Senior Member+ Theremingenieur's Avatar
    Join Date
    Feb 2014
    Location
    Colmar, France
    Posts
    1,997
    Hi Dominik,

    first step would be downsampling a copy of the image to just 19 x 17 pixels (corresponding to your LED array) in any photo editor program. Thus you'd obtain already a much smaller file which would contain the averaged color values for the LEDs without any effort and almost ready to use.
    Second step would be reading the 323 RGB values from the new bmp file and reformatting these in an array which can be read from a .h file by your sketch via include.
    Outputting the 323 color values to the LED strip is then trivial.

  3. #3
    Senior Member mortonkopf's Avatar
    Join Date
    Apr 2013
    Location
    London, uk
    Posts
    855
    to do the downsampling as Theremingenieur suggests, you can use the image converter that was set up for the POV projects using Teensy. This will give the output array in the dimensions you want, but might not be exactly to RGB saturations that you are after. You can then use the array how you wish. The converter gives the rgb values and you copy and paste this into the sketch.

    Once you have the values pasted into the sketch, you can use octows28 library, or fastled library in combination with a remapping array that takes the consecutive rgb values and repositions them for your 'snake' arrangement.

  4. #4
    Senior Member+ Theremingenieur's Avatar
    Join Date
    Feb 2014
    Location
    Colmar, France
    Posts
    1,997
    The conversion from your 19x17 bmp to an RGB array can be done with an online tool: https://manytools.org/hacker-tools/image-to-byte-array/
    Last edited by Theremingenieur; 10-26-2018 at 10:21 AM.

  5. #5
    Senior Member+ Theremingenieur's Avatar
    Join Date
    Feb 2014
    Location
    Colmar, France
    Posts
    1,997
    Just thinking out loud: once the basic task achieved, one might add a small Alps rotary encoder and do some scalar multiplication to adjust the tint (colder/warmer) of the background illumination...

  6. #6
    Senior Member mortonkopf's Avatar
    Join Date
    Apr 2013
    Location
    London, uk
    Posts
    855
    mini joystick = 2 axis, gives brightness as well as tint ;-)

  7. #7
    Senior Member+ Theremingenieur's Avatar
    Join Date
    Feb 2014
    Location
    Colmar, France
    Posts
    1,997
    So many creative heads here!

  8. #8
    Junior Member
    Join Date
    May 2018
    Posts
    6
    Quote Originally Posted by Theremingenieur View Post
    The conversion from your 19x17 bmp to an RGB array can be done with an online tool: https://manytools.org/hacker-tools/image-to-byte-array/
    Hi Theremingenieur,

    thanks for fast response, I tried the BMP converter you recommended to me, but it says, that it will convert in monochromatic data, the result had been

    //Byte array of bitmap of 24 x 11 px:

    img [] = {
    0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff,
    0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0,
    }

    I think this result wont word,
    best regards
    Dominic

  9. #9
    Junior Member
    Join Date
    May 2018
    Posts
    6
    Hi Theremingenieur,

    I already converted the original large picture to 17 x 19 pixel, so each pixel is representing one RGB LED. The name of the file is giraffe_web.bmp and a second larger one is giraffe.bmp
    Those to files had been uploaded when I started this thread.

    Best regards
    Dominic

  10. #10
    Junior Member
    Join Date
    May 2018
    Posts
    6
    Hi Mortonkopf,

    thanks for the fast response. Where can I find the image converter you are recommending? Are you or anybody else for the community able to send me a sketch, I canīt find a sketch I can modify for my project. Thank you so much, Dominic

  11. #11
    Junior Member
    Join Date
    May 2018
    Posts
    6
    that would be so cool ! can you please help me !

  12. #12
    Senior Member mortonkopf's Avatar
    Join Date
    Apr 2013
    Location
    London, uk
    Posts
    855
    @dombo66 have a look at the image converter here, put in your original image, and choose your output dimensions: http://www.orchardelica.com/poisonic/poi_page.html

    Then copy and paste the output into your sketch. What library do you intend to use? do you have ws2811 / ws2812 leds or are you using SPI type leds (APA?).

    You will find examples for using both in the menu of the IDE. Paste the array generated by the converter into the example sketch. Use the setpixel line to select the led you want to put a colour to, and select the colour from the array. You can do this by using for loops to work through the array.

  13. #13
    Senior Member mortonkopf's Avatar
    Join Date
    Apr 2013
    Location
    London, uk
    Posts
    855
    @dombo66, the below code should get you started
    Code:
    #include "FastLED.h"
    
    #define NUM_LEDS 60
    #define DATA_PIN 2
    #define CLOCK_PIN 3
    CRGB leds[NUM_LEDS];
    
    
    //put your array from the inage converter in here v
    const unsigned int array1[] = { 0x000100, 0x000100, 0x000100, 0x000100, 0x000100, 0x000100, /*etc .. add your values here*/}; //end of array
    
    //you will also need to have an array that remaps your led number into snake such as
    //const int ArrayToSnake[] = {0,1,2,3,4,5,.... 11,10,9,8,7,6 ...12,13,14,15,16,....22,21,20,}... etc
    
    
    
    void setup() {
    
    delay(200);
     // Uncomment/edit one of the following lines for your leds arrangement.
          // FastLED.addLeds<TM1803, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<TM1804, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<TM1809, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<WS2811, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<WS2812, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<WS2812B, DATA_PIN, RGB>(leds, NUM_LEDS);
         FastLED.addLeds<NEOPIXEL, DATA_PIN>(leds, NUM_LEDS);
          // FastLED.addLeds<APA104, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<UCS1903, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<UCS1903B, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<GW6205, DATA_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<GW6205_400, DATA_PIN, RGB>(leds, NUM_LEDS);
          
          // FastLED.addLeds<WS2801, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<SM16716, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<LPD8806, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<P9813, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<APA102, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<DOTSTAR, RGB>(leds, NUM_LEDS);
    
          // FastLED.addLeds<WS2801, DATA_PIN, CLOCK_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<SM16716, DATA_PIN, CLOCK_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<LPD8806, DATA_PIN, CLOCK_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<P9813, DATA_PIN, CLOCK_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<APA102, DATA_PIN, CLOCK_PIN, RGB>(leds, NUM_LEDS);
          // FastLED.addLeds<DOTSTAR, DATA_PIN, CLOCK_PIN, RGB>(leds, NUM_LEDS);
     
          // FastLED.addLeds<APA102, DATA_PIN, CLOCK_PIN>(leds, NUM_LEDS);
    }
    
    
    void loop() {
      showPicture();
    
    }
    
    void showPicture(){
    //within this function you will need to remap your leds to the right place
    
    for(int screen =0;screen<NUM_LEDS;screen++){
      //put the ref to ArrayToSnake here to rework the led info coming from Array1
        leds[screen]=array1[screen];
        }
           FastLED.show();
    }

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •