JacDac Komponete für den Calliope Mini 3

[Harald_Rau]

Hello,
I have now tried to implement a JacDac component for the Calliope Mini 3 as a part. For this, I adjusted the files from Calliope GmbH.
I also created a PCB view. This was actually not necessary, because a PCB will hardly be made for JacDac components. I only did it to fit with Fritzing.
Is the part okay like this?
What mistakes did I make?
What still needs to be changed?

Jac Dac Keycap Button.fzpz (14,1 KB)

Here’s another example with the JacDac Keycap Button.

Calliope_Button.fzz (74,8 KB)

Best regards,
Harald!

[vanepp]

@Harald_Rau

What mistakes did I make?

Not really any, the part works (except for pcb) so it would work as is.

@Harald_Rau

What still needs to be changed?

There is a fair amount that should change to make a better part.

First the text at the bottom of the board is not in group breadboard and thus won’t export as an image.

Here I ungrouped the groups above breadboard to make this easier (I prefer to have a single group that covers the entire breadboard, although multiple groups will work fine.)

then move the text in to the group breadboard by clicking the indent node tab in xml editor to move it in to breadboard like this.

Then the connectors are in the wrong order, connector 0 should be on the top left not the bottom left and the pin numbers increase in order (as with an IC)

the bottom pin on the right should be connector3 not connector5

then it is preferable for all the pins to be at the bottom of the svg like this.

This allows a python script to renumber the terminals for you.

Then the size appears to be incorrect. The grey image on the top is the svg from

Jacdac - Keycap Button

which should be the actual size of the part as far as I can see. So rescale the breadboard svg to match the width of the reference svg like this

to do that copy the width from the tool bar, then set the width locked to height and scale stroke-width icons in Inkscape and select the entire breadboard image. Now replace the current width (circled in red here) with the saved width of the reference svg to rescale the svg.

now the breadboard svg matches the size of the reference file and should match the size of the real life part (it shrinks by a little bit)

the do edit->resize page to selection to adjust the viewbox to the new size.

then group the entire svg and set the group name to breadboard to set the layerid

then save the breadboard svg as it is done. On to schematic. Again this schematic will work but has a few issues. The label should be A (for assembly indicating this is a module) and the pins should be 0.1in long (not the current 0.2in.)

The easy way to fix this is to use Randy’s Inscape Fritzing schematic extension from this post

Fritzing-Schematic an Inkscape extension - released

Hi all! I have been working on an extension for Inkscape to create rectangular schematic symbol .svg files for use in Fritzing. I think I created a useful tool to speed up creation of schematic symbols, and now I want to share it with the community. It’s available on github: https://github.com/revolt-randy/Fritzing-Schematic-an-Inkscape-Extension. To install: In Inkscape, the edit menu → user preferences → system will have an option for ‘User extensions’ - allowing you to open the folder to…

like this. Here I loaded the schematic svg and deleted the schematic to make a blank svg then launched the schematic extension

First we need to set some paramaters

We need to set Keycap Button as the label and the sizes to 0.8in wide and 0.4in high (the height needs to be 0.1in larger than the number of pins)
Then we need to change to the Schematic Connectors tab and set the number of pins on left and right t0 3 each and set the other parameters as shown.

then press apply. That brings up either an error message (if you got one of the parameters wrong!) or this

where it wants you to set the text for the various pins.

then click “finished” to commit the changes that brings up the next set of pins like this (note we are now doing the right side pins starting at the bottom of the right side pins)

when done click “finished” and it will create the schematic svg like this:

Here the scale is set to the correct value (where drawing units are 1/1000 of an inch), the labels are all the correct colors as specified in the graphics standards document and the schematic svg is ready for saving. Now on to the pcb view

This pcb view would do, but it would be better to just not have the part have a pcb view (as it isn’t useful.) To do that we need to modify the .fzp file so lets move on to that. Starting at the top of the fzp file set the current (1.0.3 in my case and I think yours) Fritzing version by changing

<module fritzingVersion="0.7.2b" moduleId="JacDac Keycap Button_9671bc83bab6fa63f5d55a46cb29ffa4_8" referenceFile="JacDac Keycap Button_5bc481833b0d02f3142b6f3d5a7ebeed_25.fzp">

to

<module fritzingVersion="1.0.3" moduleId="JacDac Keycap Button_9671bc83bab6fa63f5d55a46cb29ffa4_8" referenceFile="JacDac Keycap Button_9671bc83bab6fa63f5d55a46cb29ffa4_8.fzp">

then correct the version from 4 to 1 (as this is the first version of this part.) Nothing uses this value so it is only cosmetic.

  <version>4</version>

to

   <version>1</version>

then change

  <label>Jac Dac Keycap Button</label>

to

  <label>A</label>

to set the label to A for assembly. Then change

  <properties>
    <property name="package">JacDac</property>

to

  <properties>
    <property name="package">JacDac Keycap Button</property>

as there will probably be more JacDac parts and we need to be able to differentiate between them. Now we need to suppress the pcb view. To do that replace

    <pcbView>
      <layers image="pcb/JacDac Keycap Button_cf205303d297ba0950044bec99d14359_3_pcb.svg">
        <layer layerId="copper1"/>
        <layer layerId="silkscreen"/>
        <layer layerId="copper0"/>
      </layers>
    </pcbView>

with

    <pcbView>
      <layers image="breadboard/JacDac Keycap Button_cf205303d297ba0950044bec99d14359_3_breadboard.svg">
        <layer layerId="breadboard"/>
      </layers>
    </pcbView>

which was copied from the breadboard layer as pcb needs an svg to render even if we don’t want a pcb view and it will happily reprocess breadboard view. To suppress pcb view. Then we need to replace the current connectors with a new set that doesn’t have pcb view defined (and in this case change the order of the pins as well)

  <connectors>
      <connector id="connector0" type="male" name="Pin 1">
        <description>Data</description>
        <views>
          <breadboardView>
            <p svgId="connector0pin" layer="breadboard" terminalId="connector0terminal"/>
          </breadboardView>
          <schematicView>
            <p svgId="connector0pin" layer="schematic" terminalId="connector0terminal"/>
          </schematicView>
        </views>
      </connector>
      <connector id="connector1" type="male" name="Pin 2">
        <description>GND</description>
        <views>
          <breadboardView>
            <p svgId="connector1pin" layer="breadboard" terminalId="connector1terminal"/>
          </breadboardView>
          <schematicView>
            <p svgId="connector1pin" layer="schematic" terminalId="connector1terminal"/>
          </schematicView>
        </views>
      </connector>
      <connector id="connector2" type="male" name="Pin 3">
        <description>3V3</description>
        <views>
          <breadboardView>
            <p svgId="connector2pin" layer="breadboard" terminalId="connector2terminal"/>
          </breadboardView>
          <schematicView>
            <p svgId="connector2pin" layer="schematic" terminalId="connector2terminal"/>
          </schematicView>
        </views>
      </connector>
      <connector id="connector3" type="male" name="Pin 4">
        <description>Data</description>
        <views>
          <breadboardView>
            <p svgId="connector3pin" layer="breadboard" terminalId="connector3terminal"/>
          </breadboardView>
          <schematicView>
            <p svgId="connector3pin" layer="schematic" terminalId="connector3terminal"/>
          </schematicView>
        </views>
      </connector>
      <connector id="connector4" type="male" name="Pin 5">
        <description>GND</description>
        <views>
          <breadboardView>
            <p svgId="connector4pin" layer="breadboard" terminalId="connector4terminal"/>
          </breadboardView>
          <schematicView>
            <p svgId="connector4pin" layer="schematic" terminalId="connector4terminal"/>
          </schematicView>
        </views>
      </connector>
      <connector id="connector5" type="male" name="Pin 6">
        <description>3V3</description>
        <views>
          <breadboardView>
            <p svgId="connector5pin" layer="breadboard" terminalId="connector5terminal"/>
          </breadboardView>
          <schematicView>
            <p svgId="connector5pin" layer="schematic" terminalId="connector5terminal"/>
          </schematicView>
        </views>
      </connector>
  </connectors>
  <buses>
    <bus id="Data">
      <nodeMember connectorId="connector0"/>
      <nodeMember connectorId="connector3"/>
    </bus>
    <bus id="GND">
      <nodeMember connectorId="connector1"/>
      <nodeMember connectorId="connector4"/>
    </bus>
    <bus id="3V3">
      <nodeMember connectorId="connector2"/>
      <nodeMember connectorId="connector5"/>
    </bus>
  </buses>

I have a python script which generates such boiler plate with blank description fields meaning I only need to add the pin labels to the description. I also changed the bus labels to reflect the pin name that they refer to for more clarity. That completes the part, so now run it through FritzingCheckPartw.py to clean it up and check it

$ FritzingCheckPartw.py ‘part.JacDac Keycap Button_9671bc83bab6fa63f5d55a46cb29ffa4_8.fzp’

**** Starting to process file Startup, no file yet

**** Starting to process file part.JacDac Keycap Button_9671bc83bab6fa63f5d55a46cb29ffa4_8.fzp

**** Starting to process file svg.breadboard.JacDac Keycap Button_cf205303d297ba0950044bec99d14359_3_breadboard.svg.bak

**** Starting to process file svg.schematic.JacDac Keycap Button_cf205303d297ba0950044bec99d14359_3_schematic.svg.bak

**** Starting to process file svg.breadboard.JacDac Keycap Button_cf205303d297ba0950044bec99d14359_3_breadboard.svg.bak

Warning 29: File
‘part.JacDac Keycap Button_9671bc83bab6fa63f5d55a46cb29ffa4_8.fzp.bak’

Processing view pcbView, File svg.breadboard.JacDac Keycap Button_cf205303d297ba0950044bec99d14359_3_breadboard.svg.bak
has already been processed
but will be processed again as part of this fzp file in case of new warnings.

which shows no problems, so make and test the new part which results in this part:

Jac Dac Keycap Button-fixed.fzpz (14.4 KB)

which should do what you want. Hope this helps!

Peter

[Harald_Rau]

First of all, thank you very much, I have translated everything and will take it into account for the other parts.
The part works excellently and the dimensions from the PDF printout also match the original part.

@vanepp

Here I ungrouped the groups above breadboard to make this easier (I prefer to have a single group that covers the entire breadboard, although multiple groups will work fine.)

The “Breadboard” group always shifts when working with the internal parts editor. Maybe I need to work more in the xml file.

@vanepp

Then the connectors are in the wrong order, connector 0 should be on the top left not the bottom left and the pin numbers increase in order (as with an IC)

I suspect that the component editor does this too, in the order in which I click the pins to connect them to the graphic. So I want to edit the xml file here too.

@vanepp

Then the size appears to be incorrect. The grey image on the top is the svg from

I had determined the dimensions (35 mm x 25 mm) from the original using a caliper and entered them. But Inkscape must have scaled it. I can’t always say exactly what Inkscape does on its own.

@vanepp

The label should be A (for assembly indicating this is a module) and the pins should be 0.1in long (not the current 0.2in.)

I used an old template from Fritzing for the diagram. That was the MAX485 chip. The tool described is of course much, much better. Thanks for that too!

I’ll try to use this part and the instructions as a reference for the other JacDac parts.

Greetings and thanks Harald!

[vanepp]

@Harald_Rau

The “Breadboard” group always shifts when working with the internal parts editor. Maybe I need to work more in the xml file.

For some reason parts editor loves to add groups. I usually start by either starting at the top group and ungrouping recursively til there aren’t any more groups (which has the benefit of removing most of the translates) before editing then use edit select all and group to form the breadboard group. I also rarely use parts editor and just edit the xml file directly.

@Harald_Rau

I had determined the dimensions (35 mm x 25 mm) from the original using a caliper and entered them. But Inkscape must have scaled it. I can’t always say exactly what Inkscape does on its own.

me either, I have seen it do strange things many times!

Peter

[Harald_Rau]

Hello Peter,
I wanted to continue working on the JacDac components. I managed to do this with two examples thanks to your instructions.
But I absolutely cannot adjust the size of one part.
The breadboard view is simply about 2 mm too big.
When I look at the exported svg files, everything is correct. If I insert them into Fritzing, the “light sensor” is a bit larger.
Do you have any idea what I’m doing wrong?
Greetings, Harald!

Part:
Lichtsensor.fzpz (17,6 KB)

Sketch:
Fehlersuche.fzz (32,7 KB)

[vanepp]

Yep this is an easy one. Your svg is dimensioned in px, it needs to be in inches or mm. In px Fritzing guesses between 72DPI (Illustrator) and 90DPI (older Inkscape) but current Inkscape (which looks to be what you are using) is 96DPI which doesn’t match either so the scale will be incorrect. Changing the dimensions to in or mm here and rescaling the image to be the correct size should correct this.

FritzingCheckPart.py issues the following warning about this:

Warning 19: File
‘svg.breadboard.Lichtsensor_13cb11814104913a7f41773a08306325_2_breadboard.svg.bak’
At line 16

Height 94.488182 is defined in px
in or mm is a better option (px can cause scaling problems!)

Warning 19: File
‘svg.breadboard.Lichtsensor_13cb11814104913a7f41773a08306325_2_breadboard.svg.bak’
At line 16

Width 105.79971 is defined in px
in or mm is a better option (px can cause scaling problems!)

Peter

[Harald_Rau]

…thank you very much. I’ll check that out right away!

[Harald_Rau]

I can’t believe it - It works, I won’t make that mistake again!
Thank you very much!

[vanepp]

It is an easy mistake to make and causes a lot of problems.

Peter