Maker.io main logo

A Colorful CLUE Slideshow Purse With Bright Wearables

2024-06-07 | By Adafruit Industries

License: See Original Project Displays LCD / TFT Programmers Wearables

Courtesy of Adafruit

Guide by Anne Barela

Overview

lcds___displays_hero-large-uncompress

Wearable electronics clothing and accessories continue to remain ‎very popular with designers and fashion lovers alike. Adafruit has ‎featured a great number of wearable projects. Many of them have ‎required sewing skills, electronic skills, or both.‎

Bright Wearables is a recent company that has designed a board ‎which interfaces with a BBC micro:bit or Adafruit CLUE board. The ‎Bright Board may be incorporated into one's own designs or paired ‎with a number of backpack and handbag styles specifically ‎designed to highlight the multicolored, programmable LEDs and the ‎board's display.‎

This project pairs a Bright Wearables crossbody bag and Bright ‎Board with the Adafruit CLLE to provide a colorful, changeable ‎picture display surrounded by lights. It would look great shopping, ‎socializing or for nightlife.‎

Adafruit Parts

people_2

Bags

  • ‎1 x Bright Wearables Bright Board‎
  • 1 x Bright Wearables Grace Bag

This project uses the Bright Board by BrightWearables.com. The ‎board works with both the BBC micro:bit and Adafruit CLUE. It ‎contains 12 nice RGB DotStar LEDs in a circle, an on/off switch, and a ‎battery pack.‎

You can place the Bright Board into your own purse or wearable ‎with the knowledge that all the electronics are safe from jostling (no ‎finicky metallic thread like in some projects).‎

Bright Wearables sells purses and backpacks specifically made to ‎have the Bright Board snap in. This project uses the Grace crossbody ‎phone bag (which comes in three colors). All the bags allow the LEDs ‎and the micro:bit/CLUE display to show through the bag.‎

The bags and the Bright Board may be purchased as a bundle. For ‎this project, selecting a bundle with the bag of your choice + the ‎Bright Board without the micro:bit board may be what you want.‎

Other products on BrightWearables.com

CircuitPython on CLUE

CircuitPython is a derivative of MicroPython designed to simplify ‎experimentation and education on low-cost microcontrollers. It ‎makes it easier than ever to get prototyping by requiring no upfront ‎desktop software downloads. Simply copy and edit files on ‎the CIRCUITPY flash drive to iterate.‎

The following instructions will show you how to install CircuitPython. ‎If you've already installed CircuitPython but are looking to update it ‎or reinstall it, the same steps work for that as well!‎

Set up CircuitPython Quick Start!‎

Follow this quick step-by-step for super-fast Python power :)‎

Download the latest version of CircuitPython for CLUE from ‎circuitpython.org

Click the link above to download the latest version of ‎CircuitPython for the CLUE.‎

Download and save it to your desktop (or wherever is handy).‎

download_3

Plug your CLUE into your computer using a known-good USB cable.‎

A lot of people end up using charge-only USB cables and it is very ‎frustrating! So, make sure you have a USB cable you know is good ‎for data sync.‎

Double-click the Reset button on the top (magenta arrow) on your ‎board, and you will see the NeoPixel RGB LED (green arrow) turn ‎green. If it turns red, check the USB cable, try another USB port, ‎etc. Note: The little red LED next to the USB connector will pulse red. ‎That's ok!‎

If double-clicking doesn't work the first time, try again. Sometimes it ‎can take a few tries to get the rhythm right!‎

board_4

You will see a new disk drive appear called CLUEBOOT.‎

Drag the adafruit-circuitpython-clue-etc.uf2 file to CLUEBOOT.‎

drive_5

drive_6

The LED will flash. Then, the CLUEBOOT drive will disappear, and a ‎new disk drive called CIRCUITPY will appear.‎

If this is the first time, you're installing CircuitPython or you're doing ‎a completely fresh install after erasing the filesystem, you will have ‎two files - boot_out.txt, and code.py, and one folder - lib on ‎your CIRCUITPY drive.‎

If CircuitPython was already installed, the files present before ‎reloading CircuitPython should still be present on ‎your CIRCUITPY drive. Loading CircuitPython will not create new ‎files if there was already a CircuitPython filesystem present.‎

That's it, you're done! :)

new_7

Code

Text Editor

Adafruit recommends using the Mu editor for using your ‎CircuitPython code with the CLUE boards. You can get more info ‎in this guide.‎

Alternatively, you can use any text editor that saves files.‎

Installing Project Code

To use with CircuitPython, you need to first install a few libraries, into ‎the lib folder on your CIRCUITPY drive. Then you need to ‎update code.py with the example script.‎

Thankfully, we can do this in one go. In the example below, click ‎the Download Project Bundle button below to download the ‎necessary libraries and the code.py file in a zip file. Extract the ‎contents of the zip file, open the ‎directory CLUE_Purse_Slideshow/ and then click on the directory ‎that matches the version of CircuitPython you're using and copy the ‎contents of that directory to your CIRCUITPY drive.‎

Your CIRCUITPY drive should now look similar to the following ‎image:‎

drive_8

Download Project Bundle

Copy Code
# SPDX-FileCopyrightText: 2020 Anne Barela for Adafruit Industries
#
# SPDX-License-Identifier: MIT

# Bright Wearables Purse Slideshow with FancyLED
# Anne Barela for Adafruit Industries, February 2020
# MIT License

import board
import adafruit_dotstar as dotstar
from adafruit_clue import clue
from adafruit_slideshow import SlideShow, PlayBackDirection
import adafruit_fancyled.adafruit_fancyled as fancy

# Set the LED ring speed and brightness
LED_SPEED = 0.2 # pick a number from 0 (no motion) to 1.0 (fastest!)
BRIGHTNESS = 0.2 # pick a number from 0 (dark) to 1.0 (bright!)

# colors available are RED, YELLOW, ORANGE, GREEN, TEAL
# CYAN, BLUE, PURPLE, MAGENTA, WHITE, BLACK, GOLD, PINK
# AQUA, JADE, AMBER, VIOLET, SKY - pick any color set!
# 3 to 5 colors looks best...
palette = [clue.PINK, clue.GOLD, clue.JADE]

# For the Bright Wearables DotStar LED Ring
num_leds = 12
pixels = dotstar.DotStar(board.P13, board.P15, num_leds, auto_write=False)
offset = 0

# Create the BMP displayer
slideshow = SlideShow(clue.display, None, folder="/",
auto_advance=False)

# turn palette to fancytype
for i, color in enumerate(palette):
palette[i] = fancy.CRGB(*[x / 255 for x in color])

while True:
if clue.button_b:
slideshow.direction = PlayBackDirection.FORWARD
slideshow.advance()
if clue.button_a:
slideshow.direction = PlayBackDirection.BACKWARD
slideshow.advance()

# spin the LEDs
for i in range(num_leds):
# Load each pixel's color from the palette using an offset, run it
# through the gamma function, pack RGB value and assign to pixel.
color = fancy.palette_lookup(palette, offset + i / num_leds)
color = fancy.gamma_adjust(color, brightness=BRIGHTNESS)
pixels[i] = color.pack()
pixels.show()
offset += LED_SPEED / 10

View on GitHub

Assembly

Place the Bright Board into Your Wearable

Follow the instructions on brightwearables.com on assembly of the ‎Bright Board with your wearable. This includes:‎

  • Installing batteries in the battery case
  • Plugging in the battery connector into the bottom of the Bright ‎Board
  • Inserting the Bright Board into your purse/backpack
  • Securing the Bright Board with the built-in snaps

bright_9

Inserting CLUE into the Bright Board

Insert the CLUE into the slot in the Bright Board, so the CLUE display ‎is facing the transparent window in the wearable (facing out) and ‎the electronics laden side of CLUE faces in towards the bag. Please ‎double check, as the CLUE can be inserted the other way around ‎and that's not going to work. Also be sure the CLUE board is pressed ‎firmly on both sides into the Bright Board slot, so all the connections ‎are made.‎

Use

wearable_10

The Bright Board has a handy on/off switch on the board. When ‎switched on, the screen should show some brief boot information ‎before displaying the first picture on screen and making the DotStar ‎LEDs light up.‎

LED Ring Display

The DotStars cycle through three colors selected in the code. Up to ‎five may be selected to look best:‎

Download File

Copy Code
# colors available are RED, YELLOW, ORANGE, GREEN, TEAL
# CYAN, BLUE, PURPLE, MAGENTA, WHITE, BLACK, GOLD, PINK
# AQUA, JADE, AMBER, VIOLET, SKY - pick any color set!
# 3 to 5 colors looks best...
palette = [clue.PINK, clue.GOLD, clue.JADE]

You may use Mu or a text editor to change the colors you like. The ‎pictures you select, and the color of the bag may guide your choice ‎as to colors.‎

The colors will cycle through those chosen. Kind of an "Amberlite" ‎type effect but the lights are not dependent on the picture chosen.‎

Picture Slideshow

The code will display the first bitmap it sees in the root directory of ‎the CIRCUITPY drive. You may have as many pictures as you like, up ‎to the capacity of the CIRCUITPY drive. All pictures should be 240 x ‎‎240 pixels square and saved in bitmap (BMP) format with a .bmp file ‎extension.‎

The three sample bitmap files are in the GitHub repo and if you ‎selected Download: Project Zip on the code page, the three files are ‎in the zip file (or get them in the link in the line above).‎

To change the displayed image, you use the CLUE A and B buttons: ‎B on the right side of the display advances to the next image, A on ‎the left of the display goes back to the previous image. The buttons ‎are not visible on the outside of the purse but are easily pressed ‎through the material. Only you will know the magic.‎

magic_11

Power

The Bright Board has a convenient slide switch on it for power ‎‎(circled in blue below). To turn on the lights, slide the switch on and ‎turn it off to conserve power. If you decide to remove your CLUE ‎board from the Bright Wearables board, please be sure to turn the ‎power off to protect the electronics.‎

complete_12

Enjoy

Enjoy your colorful wearable!‎

制造商零件编号 4500
CLUE NRF52840 EXPRESS
Adafruit Industries LLC
¥365.90
Details
制造商零件编号 592
CABLE A PLUG TO MCR B PLUG 3'
Adafruit Industries LLC
¥24.01
Details
Add all DigiKey Parts to Cart
TechForum

Have questions or comments? Continue the conversation on TechForum, DigiKey's online community and technical resource.

Visit TechForum